SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot moretea's Avatar
    Join Date
    Jun 2004
    Location
    Texas, USA
    Posts
    117
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Question Creating event handler for dynamically created element?

    Sorry if this has been answered elsewhere, but... I use the following JS to dynamically create a <div> centered on the page. I'm trying to add an <a> to the <div> and connect an event handler to the <a> that will remove the dynamically created <div>. Seems as if the JS won't init the handler for an element that hasn't yet been created... ? TIA for your help!

    Code JavaScript:
    <script type="text/javascript">
    var showSev1_2 = {
        init: function()
        {
            var hrefSev1_2 = document.getElementById("hrefSev1_2");
            hrefSev1_2.onclick = showSev1_2.clickHandler;
        },
        clickHandler: function()
        {
            wrapper=document.createElement("div");
            wrapper.id = "wrapper";
            chart = document.createElement("img");
            chart.src = "my.jpg";
            chart.id = "chart";
            shadow = document.createElement("img");
            shadow.src = "shadow.gif";
            shadow.id = "shadow";
            closeWrapper = document.createElement("a");
            closeWrapper.href = "#";
            closeWrapper.id = "closeWrapper";
            txtCloseWrapper = document.createTextNode("Close this chart");
            closeWrapper.appendChild(txtCloseWrapper);
            wrapper.appendChild(closeWrapper);
            wrapper.appendChild(chart);
            wrapper.appendChild(shadow);
            document.getElementsByTagName("body")[0].appendChild(wrapper);
        }
    }
    Core.start(showSev1_2);
    var showCloseWrapper = {
        init: function()
        {
        if (document.getElementById("closeWrapper")) 
            {
            closeWrapper.onclick = closeWrapper.clickHandler;
            }
        },
        clickHandler: function()
        {
            document.getElementsByTagName('body')[0].removeChild(wrapper);
        }
    }
    Core.start(showCloseWrapper)
    </script>

  2. #2
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Where is "closeWrapper" defined?
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  3. #3
    SitePoint Zealot moretea's Avatar
    Join Date
    Jun 2004
    Location
    Texas, USA
    Posts
    117
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    <slaps forehead> Yes, thanks for catching that. I had to sleep on it overnight to find that, myself.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •