Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Problem with new Function event in Firefox 1

Status
Not open for further replies.

MonsterMan

Programmer
Jan 30, 2001
2
AU
The problem is that Firefox does not appear to recognise the event keyword when a new function is created dynamically. See line 14 in the code below. Any help would be really appreciated.
Code:
 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<SCRIPT LANGUAGE="JavaScript" >
function createTbl() {
	var tblBody = document.createElement("tbody");
			
	var row = document.createElement("tr"); 
	var cell = document.createElement("td"); //Create the cell

	cell.setAttribute("className","booking") // IE							
	cell.setAttribute("class","booking") // Firefox							

	cell.onclick = new Function("onclick=testClick(event)")
	cell.innerHTML = "Click Me!"
				
	row.appendChild(cell);			
	tblBody.appendChild(row);				

	var tbl = document.createElement("table");
	tbl.appendChild(tblBody);
	document.body.appendChild(tbl);
}

function testClick(evnt){ alert(evnt.clientX) }

</SCRIPT>
<style type="text/css">
<!--
.booking {
	text-align: center;
	background-color: #ddeeCC;
	border: 1px solid #CCCCCC;
	cursor: pointer;	
}
-->
</style>
</head>
<body style="margin:50" onLoad="createTbl()" >
</body>
</html>
 
[1] You could simply use dot convention to assign a stnadardize className property instead of setting up two.
[tt]
[blue]/*[/blue]
cell.setAttribute("className","booking") // IE
cell.setAttribute("class","booking") // Firefox
[blue]*/[/blue]
[blue]cell.className="booking";[/blue]
[/tt]
[2] For event handling, you need to modify at a couple of places.
[2.1][tt]
[red]//[/red]cell.onclick = new Function("onclick=testClick(event)")
cell.onclick = new Function([blue]"event",[/blue]"onclick=testClick(event)")
[/tt]
[2.2][tt]
function testClick(evnt){
evnt=(window.event)?window.event:evnt;
//or less confusing a new name such as
//var evt=(window.event)?window.event:evnt;
//here, it is just for keeping the alert line unchanged
alert(evnt.clientX)
}
[/tt]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top