使用Javascript的onclick与表行
https://stackoverflow.com/questions/454517
-
19-08-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian题
我有我的JScript代码的问题。我通过所有行的表中的尝试循环，并添加一个onclick事件。我能得到的onclick事件中加入，但有几个问题。
的第一个问题是，所有行最终得到设置有用于onclick事件的错误的参数。
的第二个问题是，它只能在IE中。
下面是代码摘录...
shanesObj.addTableEvents = function(){
table = document.getElementById("trackerTable");
for(i=1; i<table.getElementsByTagName("tr").length; i++){
row = table.getElementsByTagName("tr")[i];
orderID = row.getAttributeNode("id").value;
alert("before onclick: " + orderID);
row.onclick=function(){shanesObj.tableRowEvent(orderID);};
}}
shanesObj.tableRowEvent = function(orderID){
alert(orderID);}
在表位于以下位置...
http://www.blackcanyonsoftware.com/OrderTracker/testAJAX.html
的ID序列中的每一行的的是... 95，96，94 ...
出于某种原因，当shanesObj.tableRowEvent被调用时，的onclick被设置用于与最后的值id的所有行，通过迭代继续环路（94）。
我添加了一些警报到页面来说明这个问题。
解决方案
当一个函数被调用以JavaScript，这种情况发生的第一件事情是解释设置范围链到它被定义功能时的状态。在你的情况的范围链如下：
GLOBAL
|
CAll addTableEvents
|
CALL onclick
因此，当变量的的orderID 是在由JavaScript解释它搜索该变量的范围链绊倒。没有单编号的的onclick 的函数中定义的，因此下一个景点看看里面的 addTableEvents 。你可能会认为单编号时，这里定义的，但因为你没有申报的单编号替换var关键字，单编号成为一个全局变量，所以<我>的orderID 的未发现里面的 addTableEvents 的。最后点看是内部GLOBAL，果然它是存在的，并且它的值是最后一个，它被分配，并且在这种情况下的的orderID = row.getAttributeNode的其最后的值（“ID”） .value的; 的在for循环
要看到这更清楚地看下面的
shanesObj.addTableEvents = function(){
table = document.getElementById("trackerTable");
for(i=1; i<table.getElementsByTagName("tr").length; i++){
row = table.getElementsByTagName("tr")[i];
orderID = row.getAttributeNode("id").value;
alert("before onclick: " + orderID);
row.onclick=function(){var orderID = orderID; shanesObj.tableRowEvent(orderID);};
}
orderID = -1;
}
shanesObj.tableRowEvent = function(orderID){
alert(orderID);
}
点击这里的结果将总是-1。
所以，要解决这个问题，我建议你放弃所有额外的和不需要的代码，并使用类似以下，
for(i=1; i<table.getElementsByTagName("tr").length; i++){
row = table.getElementsByTagName("tr")[i];
row.onclick=function(){shanesObj.tableRowEvent(this.id);};
}
只需直接从被调用的对象访问的id属性。
P.S。我不知道为什么你的代码不能在IE浏览器（它在我的IE7的工作）。
其他提示
为什么不把事件处理程序附加到表，抓住燃煤点击处理程序内单击事件细胞的rowIndex位置。
y'cant比这更简单！点击 显然可以用动态构建行使用。结果 很多的爱，结果 某人
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
var TO,URL;
function Link(url){
URL=url;
TO=setTimeout('window.location=URL;',500);
}
//-->
</script>
</head>
<body>
<tr onclick="Link('anotherpage.html');">
<td>row1 cell1</td>
<td>row1 cell2</td>
</tr>
<tr onclick="Link('yetanotherpage.html');">
<td>row2 cell3</td>
<td>row2 cell4</td>
</tr>
</body>
</html>
