CFLAYOUTAREA and javascript and innerHTML

Question

Ok, this is a little complicated and it is not necessary limited to ColdFusion.
(And seeing's how there are so few replies these days here, I'll cross post in various forums!)
Here goes.
I have a cflayout with several cflayoutareas, and nested cflayouts.  In some of them I have a photos tab.
In those photo tabs, I call a custom tag that displays a gallery of photos, dislays the primary one and offers thumbnails.  Click on a thumbnail
and a Javascript function (changeImage) uses htmlid.innerHTML=newpic.
It works as expected.  Perfectly!
EXCEPT WHEN more than one Photo tab has images in it!
The javascript function seems to get confused which cflayout tab it is in?  Or which "instance" it is using?
Also each "tab" has its own javascript function, so ... each redundant js function cancels each other out?
So ... I went and ...
- commented out the JS function in the custom tag. 
- copied it to the shell of my web site so it's ALWAYS there for any photo custom tag to find; but only one of them.
- added what I'll call an instance ... when I call the photo custom tag added a unique parameter I called window with an ID in it.  Changed the <span id="photo"> to <span id="#attributes.window#">
and when calling the javascript added  a href="javascript:changeImage'#var1#', '#var2#', '#var3#', '#attributes.window#">
- then in the shell added window to the () of the call
- I then dump all the values ... in the js function.
- all are ok, it gets the window value, the proper image name and does a window.innerHTML.newpic;  just fine.
only there's no change onscreen.
If you have followed thus far, THANKS! 
How do I get the javascript to "find" the right cflayoutarea or is that even the problem?
Thanks a million!

Answer 1

Newsgroup_User wrote: The innerHTML
property was originally created by Microsoft as a proprietary shortcut,
but proved to be so useful, it was adopted by all other browsers. Although
innerHTML is not currently part of the W3C specification, it has proved
so useful that it now forms part of the draft specification for HTML5:
http://dev.w3.org/html5/html4-differences/Overview.html#htmldocument-extensions
Checking web pages and scripts against validators is a good
habit to get into. However, web technology is still evolving, so it's also
important to understand that the specifications change only at a
glacial pace. Sometimes, it makes sense to adopt practices that don't
follow the specs to the letter.
I just received the following from the good people at jQuery.  I thought that I might share it with you. 
Someone suggested:
> ...what is wrong with just having:-
> var todayEl = document.getElementById("today");
> todayEl.innerHTML = formatDate(new Date);
Another replied:  document.ElementById has a bug in ie6 and ie7 that will return an element with a name attribute of the same value.  Use $('#today') instead.
todayEl.innerHTML = "something" can cause memory leaks if events are added to DOM objects inside of todayEl and then just written over
instead of being removed first.  Use $('#today').html(formatDate(new Date)); instead if this could be a cause for concern.
Perhaps someone would like to comment further.
Roddy