[Javascript] Trouble with id

Peter Brunone peter at brunone.com
Mon Jun 4 22:39:33 CDT 2007


A couple of things come to mind.  First, IIRC, the spec actually says you should *not* use a number for the ID attribute.

Second, according to your HTML below, the onmouseover event handler should never fire because it's stuck to the attribute before it (and technically the name of the event should be in all lowercase).

However, neither of these is likely to cause the consistent behavior you've described.  Can you show us a sample of the HTML where you're using a string as the id?  I would guess it has to do with the fact that your event handler code should have quotes around it just like any other HTML attribute, and you're not switching quote types (i.e. single to double) when delimiting the ID parameter.  If you *don't* use quotes around the parameter, then the JS parser will think you're referring to a variable named hint4, which of course does not exist.

In short, this would be right:

<a href="#" onmouseover ="toggle_visibility('hint4')">
<img src="../../image/icon_toggle.jpg" width="22" height="22" 
border="0"></a>
<span class = "hidden_hint" id="hint4">
Add -<img src="../images/sq_root_7.gif" align="absmiddle"> to both sides
of the equation.
</span>

Does that help?

Cheers,

Peter

From: "Del Wegener" del at delweg.com

Good Day;

This is the JavaScript function
function toggle_visibility(id)
{
var e = document.getElementById(id);
if(e.style.visibility != 'visible')
e.style.visibility = 'visible';
else
e.style.visibility = 'hidden';
}

This is the HTML which does the calling
<a href="#"onMouseOver = toggle_visibility(104)>
<img src="../../image/icon_toggle.jpg" width="22" height="22" 
border="0"></a>
<span class = "hidden_hint" id=104>
Add -<img src="../images/sq_root_7.gif" align="absmiddle"> to both sides
of the equation.
</span>

This works fine when I use a number for the id.
However I would prefer(reasons involve the rest of the page) to use "hint4" 
for the ID
When I use hint4 with or without quotes, the whole toggle fails.
An ALERT inserted in the function returns object for id when I use hint4
and returns the number when I use a number.

I do not understand.
Can someone explain what goes wrong when I use id = hint4 ?

Thanks for any help.

Del
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20070604/5d764029/attachment.htm>


More information about the Javascript mailing list