User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 374,011 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,725 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 6489 | Replies: 3
Reply
Join Date: Sep 2004
Location: Durban, South Africa
Posts: 55
Reputation: apcxpc is an unknown quantity at this point 
Rep Power: 4
Solved Threads: 0
apcxpc's Avatar
apcxpc apcxpc is offline Offline
Junior Poster in Training

Javascript event & color change problem

  #1  
Sep 4th, 2005
hi all

I'm having an odd problem with Javascript. I created a table with a single row and a single column (and gave all of them IDs). Then I use onclick events to pick up mouseclicks and call the function clicked(evt).
I know this function is getting called, and I know this function picks up exactly which source element was clicked.

I'm trying to write it so that if the user clicks within the box, the color of the box changes. I'm having a problem with this. I've tried several slight variations of the code, but nothing seems to work.

Any help would be much appreciated.




<html>
<head>
<title>More javascript</title>

<script language=JavaScript>

function clicked(evt){

window.alert("You clicked the page element: "+evt.srcElement.id);
if (evt.srcElement.id == "mycol"){
document.style.backgroundColor=green;
myTable.style.backgroundColor=blue;
mycol.innerText="haha";
}
}

</script>
</head>


<body id="mybody" onclick="clicked(event)">

<br><br>
<table id="myTable" style="background-color: gray">
<tr id="myrow">
<td id="mycol">Click this box to change colors...</td>
</tr>
</table>
</body>


</html>

AddThis Social Bookmark Button
Reply With Quote  
Join Date: Dec 2004
Location: London or Slovakia
Posts: 1,907
Reputation: peter_budo has a spectacular aura about peter_budo has a spectacular aura about peter_budo has a spectacular aura about 
Rep Power: 9
Solved Threads: 216
Moderator
Featured Poster
peter_budo's Avatar
peter_budo peter_budo is offline Offline
Posting Virtuoso

Re: Javascript event & color change problem

  #2  
Sep 4th, 2005
This worked for me

<html>
<head>
<title>More javascript</title>

<script language=JavaScript>

function clicked(evt){

window.alert("You clicked the page element: "+evt.srcElement.id);
if (evt.srcElement.id == "mycol"){
document.bgColor="green";
myTable.bgColor="blue";  
mycol.innerText="haha"; 
}
}

</script>
</head>


<body id="mybody" onclick="clicked(event)">

<br><br>
<table id="myTable" border="1" >
<tr id="myrow">
<td id="mycol" style="cursor: pointer;"  >Click this box to change colors...</td>
</tr>
</table>
</body>


</html>
Learn to see in another's calamity the ills which you should avoid.
Publilius Syrus
(~100 BC)

If we helped you to solve your problem, answered your question please mark your post as SOLVED.
Reply With Quote  
Join Date: Sep 2004
Location: Durban, South Africa
Posts: 55
Reputation: apcxpc is an unknown quantity at this point 
Rep Power: 4
Solved Threads: 0
apcxpc's Avatar
apcxpc apcxpc is offline Offline
Junior Poster in Training

Solution Re: Javascript event & color change problem

  #3  
Sep 4th, 2005
Thanks very much peter_budo. Any idea why my code wouldn't work?
Reply With Quote  
Join Date: Dec 2004
Location: London or Slovakia
Posts: 1,907
Reputation: peter_budo has a spectacular aura about peter_budo has a spectacular aura about peter_budo has a spectacular aura about 
Rep Power: 9
Solved Threads: 216
Moderator
Featured Poster
peter_budo's Avatar
peter_budo peter_budo is offline Offline
Posting Virtuoso

Re: Javascript event & color change problem

  #4  
Sep 5th, 2005
You used comands for DOM which you did not declared.

document.style.backgroundColor=green;
Learn to see in another's calamity the ills which you should avoid.
Publilius Syrus
(~100 BC)

If we helped you to solve your problem, answered your question please mark your post as SOLVED.
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

DaniWeb JavaScript / DHTML / AJAX Marketplace
Thread Tools Display Modes

Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum

All times are GMT -4. The time now is 10:58 pm.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC