".addEventListener("click",function(){alert('click ')},false);"
In the older method where the event handler was assigned in the html code like onClick = "...", it is easy in Firebug to right click on the element and examine the assignment.
With the addEventListener, I can examine the element and I can see the assignment in the DOM tab, but I cannot see the action assigned to the element.
I currently have a button I have assigned a listener to but the action does not execute. What is the best way to trace this down?
Here is the assignment code.
Expand|Select|Wrap|Line Numbers
- this.makeTable =
- function (nodeId)
- {
- document.getElementById( nodeId ).innerHTML =
- '<form id="'+nodeId+'Form">'+
- ' <table id="insideTable" class="insideTable" style="padding:0px; margin:0px;" width="100%"; height="100%";> '+
- ' <tr><td id="titleBar"> '+
- ' <button'+
- ' type="button" id="'+nodeId+'Close" '+
- ' style="padding:0px; float:right; background-color:blue,color:yellow;">'+
- ' <img src="/exp/images/closeButton.gif" style="height:16px;width:16px;">'+
- ' </button>'+
- ' </td></tr><tr><td> '+
- ' <table class="insideTable" id="aPadTable" name="aPadTable" align="center"> '+
- ' <tbody id="'+nodeId+'Data" ></tbody>'+
- ' </table>'+
- ' </td></tr> '+
- ' </table>'+
- '</form>';
- //add onclick event handler to close button
- var pButton = document.getElementById( nodeId+'Close' );
- if (pButton.addEventListener)
- {
- pButton.addEventListener("click",function(){g.nodeMgr.removeNode(nodeId)},false);
- };
- };
Expand|Select|Wrap|Line Numbers
- this.removeNode =
- function (nodeId)
- {
- var elem = document.getElementById(nodeId);
- elem.parentNode.removeChild(elem);
- };
I have other buttons on my menu bar with similar assignment methods and they work fine.