javascript - stuck on using addEventListener -


im @ javascript , dom. i'd below codes when append tr , click 2nd td (last name), 2nd td value changed bold. when click 2nd td value again, normal. i've done changing bold cant make go normal. know if add button onclick method calling dethandler. not allowed make button that. need click name again go normal. guys have ideas?

<script type="text/javascript">    function appenduser()   {     var fname=prompt("please enter first name");     var lname=prompt("please enter last name");     var email=prompt("please enter email address");      var table=document.getelementbyid("appendable");      var tr=document.createelement("tr");     var td1=document.createelement("td");     var td2=document.createelement("td");     td2.id="p1";     var td3=document.createelement("td");      td1.innerhtml = fname;     td2.innerhtml = lname;     td3.innerhtml = email;      tr.appendchild(td1);     tr.appendchild(td2);     tr.appendchild(td3);     tr.style.color="green";      table.appendchild(tr);      addhandler();     }    function addhandler ()   {     var addh = document.getelementbyid('p1');      if (addh.addeventlistener)      {       addh.addeventlistener('click', applystyle, false);     }     else if (addh.attachevent)      {       addh.attachevent('onclick', applystyle);     }   }    function dethandler ()   {     alert("aa");     var deth = document.getelementbyid('p1');      if (deth.removeeventlistener)     {       deth.removeeventlistener('click', applystyle, false);       deth.style.color="blue";       //deth.style.fontweight="normal";     }     else if (deth.detachevent)     {       deth.detachevent('onclick', applystyle);     }   }    function applystyle ()   {     var add = document.getelementbyid('p1');     add.style.fontweight="bold";   }  </script> </head> <body> <table id="appendable" width='50%' border='1'><tr><th>first name</th><th>last name</th>            <th>email address</th></tr>      </tr></table>     <p><button onclick="appenduser()">append new row</button></p> </body> </html>' 

just toggle in handler

function applystyle (){     var add  = document.getelementbyid('p1');     var curr = add.style.fontweight;      add.style.fontweight = curr != 'bold' ? 'bold' : 'inherit'; } 

fiddle


Comments

Popular posts from this blog

PHPMotion implementation - URL based videos (Hosted on separate location) -

javascript - Using Windows Media Player as video fallback for video tag -

c# - Unity IoC Lifetime per HttpRequest for UserStore -