0 Replies Latest reply on Oct 25, 2009 11:40 PM by sy_ascafe

    addEventListener does not work anymore after re-creation of element of same id?

    sy_ascafe

      My script works as follow (simplified), and the addEventListener does not work after re-create of element of same id.

      Am I making any mistake and so cause it failure to work?

       

      ( I have repeated declare var el here, please just ignore it )

      ------------------------------------------------------------------------------------------ -----------

      // creating a div container

       

      var el = document.createElement('div');

      el.id = 'div1';

      document.body.appendChild(el);

       

      // then a childnode

       

      var el = document.createElement('div');

      el.id = 'div1_1';

      document.getElementById('div1').appendChild(el);

      document.getElementById('div1_1').addEventListener('click', eventHandler, true); // works fine

       

      // then try a remove event test

       

      document.getElementById('div1_1').removeEventListener('click', eventHandler, false);

      document.getElementById('div1_1').addEventListener('click', eventHandler, true); // fine, eventHandler run once only

       

      // remove event test works fine

       

      // and sometimes I need to remove all the nodes and event, and create the element with same id and attach event again

       

      var el = document.getElementById('div1_1');

      el.removeEventListener('click', eventHandler, false); // by referring the test above,  it should be work fine ...

      air.trace(document.getElementById('div1').childNodes.length)  // output 1 (no child nodes under div1_1)

      el.parentNode.removeChild(el);

      air.trace(document.getElementById('div1').childNodes.length) // output 0. ok, all nodes removed

       

      // create a childnode again

       

      var el = document.createElement('div');

      el.id = 'div1_1';

      document.getElementById('div1').appendChild(el);

      air.trace(document.getElementById('div1').childNodes.length)  // fine, output 1, html also display correctly

      document.getElementById('div1_1').addEventListener('click', eventHandler, true); // but nothing happened here