Howdy All!
I am really stuck with this one - I want to completely create a table
within JavaScript and insert it into the document, with onMouseOut and
onMouseOver handlers in the table rows.
Below is a sample of the code I have created. It all works in Netscape
7.1, but in IE 6 it shows the table but the handlers do not run. I can
prove the handlers are even there (see the commented out alert command
in the code) so why aren't they being called??
Any help on this problem would be most appreciated!
Rob
:)
<html><head><title>Untitled Document</title>
<script type="text/javascript" language="JavaScript">
function setAttribute (object, attributeName, attributeValue)
{
var attributeNode = document.createAttribute (attributeName);
attributeNode.value = attributeValue;
object.setAttributeNode (attributeNode);
} // end setAttribute method
function writeTable()
{
var menuTable = document.createElement ("table");
var tableBody = document.createElement ("tbody");
menuTable.appendChild (tableBody);
menuTable.setAttribute ("width", "100%");
menuTable.setAttribute ("border", "0");
menuTable.setAttribute ("cellPadding", "0");
menuTable.setAttribute ("cellSpacing", "0");
// Create a table row for each node in menu array.
for (var index = 0; index < 10; index ++)
{
var tableRow = document.createElement ("tr");
setAttribute (tableRow, "onMouseOut", "alert ('mouse out');");
setAttribute (tableRow, "onMouseOver", "alert ('mouse over');");
// alert (tableRow.onmouseout);
var tableCell = document.createElement ("td");
var cellText = document.createTextNode ("Test Row");
tableCell.appendChild (cellText);
tableRow.appendChild (tableCell);
tableBody.appendChild (tableRow);
} // end for
document.getElementById ("mainMenuContainer").appendChild
(menuTable);
}
</script></head>
<body onLoad="writeTable();">
<div id="mainMenuContainer"></div>
</body>
</html>
