DOM Node Creation issue

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

John H Clark - 08 Mar 2007 19:39 GMT

During the initialization of a page I use the following script to create an
image then append the image to an existing div element.

var theImage = new Image();
theImage.id = "anId";
theImage.src = "gallery/image.jpg";
var mouseAttribute = document.createAttribute("onclick");
mouseAttribute.value = "javascript:displayImage(this.id)";
theImage.setAttributeNode(mouseAttribute);
var existingDiv = document.getElementById("existingDiv");
existingDiv.appendChild(theImage);

There is a function named "displayImage";

This results in an img element being created and placed on the page as
expected. However, when the image is clicked there is no event fired in IE
7. However, in Firefox an event is fired and the response is as expected.

Why is the event not fired in IE 7? Any suggestions on how to make this
work in IE 7?

Thanks for your help.

Signature

John H Clark
www.weownit.coop

Reply to this Message

Ayush - 08 Mar 2007 22:15 GMT

John H Clark wrote ::

> During the initialization of a page I use the following script to create an
> image then append the image to an existing div element.
[quoted text clipped - 3 lines]
> theImage.src = "gallery/image.jpg";
> var mouseAttribute = document.createAttribute("onclick");

use attachEvent (for IE) and addEventListener (for other browsers) to add
the event.

> mouseAttribute.value = "javascript:displayImage(this.id)";

dont use javascript protocol here. it will not work. use :
displayImage(this.id)

> theImage.setAttributeNode(mouseAttribute);
> var existingDiv = document.getElementById("existingDiv");
> existingDiv.appendChild(theImage);

----
var theImage = new Image();
theImage.id = "anId";
theImage.src = "gallery/image.jpg";
    theImage.onclick=function(){displayImage(this.id)} // this will work on
all browsers
var existingDiv = document.getElementById("existingDiv");
existingDiv.appendChild(theImage);
----
or
----
var theImage = new Image();
theImage.id = "anId";
theImage.src = "gallery/image.jpg";
    if(thImage.attachEvent)
     theImage.attachEvent("onclick",function(){displayImage(this.id)})
    else if(theImage.addEvenetListener){
    theImahe.addEventListener("click",function(){displayImage(this.id)},false)
var existingDiv = document.getElementById("existingDiv");
existingDiv.appendChild(theImage);
----

> However, in Firefox an event is fired and the response is as expected.

Really !!

Good Luck, Ayush.

Signature

Setup Outlook Express to read MS Newsgroups :
http://www.microsoft.com/windows/ie/support/newsgroups/howto.mspx

Reply to this Message

DOM Node Creation issue

Free Magazines