javascript循环：变量等于最后一次迭代
[英]javascript loop: variable equals the last iteration
问题描述
The code below will add element once user clicks addmore link. 
用户单击添加更多链接后，下面的代码将添加元素。
The problem arrives when the user clicks the remove link. 当用户单击删除链接时，问题就来了。
I have something like these on my code 我的代码中有类似的内容
<script language="JavaScript">
var count=1;
function addmore() {
alert(count);
var printme = "<table id='table"+count+"'><tr><td><a href='#' onclick='remove(count)'>remove</a></td></tr></table";
//(other code here)...
count++;
}
function remove(y) {
alert(y)
var tab = 'table'+y;
document.getElementById(tab).style.display = "none";
}
</script>
I used the alert here so I can easily monitor the value of count it gives. 我在这里使用了警报，因此我可以轻松地监视它给出的计数值。
What happens here is that the value of 'y' (on remove function) always the same, which is the last value of count in the loop. 此处发生的是'y'的值（在删除功能上）始终相同，这是循环中count的最后一个值。
For example I click the link addmore 3 times, therefore the last value of my 'count=4'. 例如，我单击链接addmore 3次，因此我的“ count = 4”的最后一个值。 And let say I wanted to remove the 3rd element which at this point when i clicked the remove link, it must have pass argument like this remove(3). 假设我要删除第三个元素，这时我单击删除链接时，它必须具有pass参数，例如remove（3）。 But what happens here is whatever element i clicked it seems like it always passing argument this way remove(4) 但是这里发生的是我单击的任何元素，好像它总是以这种方式传递参数remove（4）
4 个解决方案
解决方案1
2 已采纳 2012-12-06 04:27:47
That's because you have count as a global variable. 那是因为您已经count一个全局变量。
Try .....onclick='remove("+count+")'.... to sort of "lock in" the value. 尝试.....onclick='remove("+count+")'....对值进行“锁定”。
解决方案2
1 2012-12-06 04:28:59
Please try this: 请尝试以下方法：
var printme = "<table id='table"+count+"'><tr><td><a href='#' onclick='remove("+count+")'>remove</a></td></tr></table";
also try following line remove function: 还可以尝试以下行删除功能：
document.getElementById(""+tab+"").style.display = "none";
解决方案3
1 2012-12-06 04:29:26
maybe just onclick='remove('+count+')' 也许只是onclick ='remove（'+ count +'）'
You can do something like 你可以做类似的事情
<html>
<head>
<script type="text/javascript">
var count=1;
function addmore() {
var id = 'table' + count;
var table = document.createElement('table');
table.setAttribute('id', id);
var tr = document.createElement('tr');
var td = document.createElement('td');
var a = document.createElement('a');
a.setAttribute('href', '#');
a.appendChild(document.createTextNode('remove ' + id));
a.onclick = function() {
table.style.display = 'none';
document.body.removeChild(table);
};
td.appendChild(a);
tr.appendChild(td);
table.appendChild(tr);
document.body.appendChild(table);
count++;
}
</script>
</head>
<body>
<a href="#" onclick="addmore()">Add Table</a>
</body>
</html>
With table reference and onclick defined like this you don't need id 使用表引用和onclick这样定义，您不需要ID
解决方案4
1 2012-12-06 04:48:06
All previous answers are correct, onclick refers to the current variable count when remove is called. 先前的所有答案都是正确的，在调用remove时，onclick表示当前变量计数。
When you generate the text for the table you use the value of count as it is then: 当您为表格生成文本时，请按原样使用count的值：
onclick='remove('+count+')...
You can leave out the id's and count altogether using this: 您可以使用以下方法省略ID并进行总数计算：
onclick='remove(this.parentElement.parentElement.parentElement);'...
function remove(elementToRemove){
elementToRemove.parentElement.removeChild(elementToRemove);
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.