Javascript Jquery绑定事件

为什么绑定到元素事件的处理程序会触发错误的结果？我希望下面Div1的click事件会弹出一个对话框，说明“Div1”，但它会弹出“div2”

我对这一点还不熟悉，我正在挠头弄清楚为什么会发生这种情况。如果有人能帮我解释一下，我将不胜感激

干杯

亚历克斯

测试事件
//对象数组
var objToTest=[{TabName:“div1”}，
{TabName:“div2”}]；
//向每个div添加事件
功能测试Whatisgoingon（myObjToTest）{
对于（我在myObjToTest中）{
$（'#'+myObjToTest[i].TabName）。单击（函数（）{TestResult（'TabName:'+myObjToTest[i].TabName）；}）；
}
}
函数测试结果（消息）{
警报（信息）；
}
$（文档）.ready（函数（）{
testwhatisgingon（objToTest）；
});
#第1部分，第2部分
{
边框：实心薄黑色；
高度：100px；
宽度：300px；
}
第1分部；单击此处显示预期结果：“TabName:div1”
第2分部；单击此处显示预期结果：“TabName:div2”

这似乎是一个典型的闭包问题，因为当您单击div（any）

i

时，变量已经到达

for

循环的末尾（因此它总是打印最后一个值）。试着这样改变

function TestWhatIsGoingOn(myObjToTest) {
    for (i in myObjToTest) {
       (function(i) {
           $('#' + myObjToTest[i].TabName).click(function() { TestResult('TabName: ' + myObjToTest[i].TabName); });
       )(i);
    }
}

---

这似乎是一个典型的闭包问题，因为当您单击div（any）

i

时，变量已经到达

for

循环的末尾（因此它总是打印最后一个值）。试着这样改变

function TestWhatIsGoingOn(myObjToTest) {
    for (i in myObjToTest) {
       (function(i) {
           $('#' + myObjToTest[i].TabName).click(function() { TestResult('TabName: ' + myObjToTest[i].TabName); });
       )(i);
    }
}

---

您的问题在代码的这一部分：

for (i in myObjToTest) {
    $('#' + myObjToTest[i].TabName).click(function() {
        TestResult('TabName: ' + myObjToTest[i].TabName);
    });
}

问题在于

i

的值没有硬编码到该部分中。当函数运行时，它将查看

i

的当前值。由于您已将其递增以引用第二个选项卡，因此此函数将始终引用第二个选项卡。Javascript的这个特性称为闭包——它以

i

的值关闭

最简单的方法是使用jQuery一次绑定到多个对象，然后根据单击的对象进行计算：

$(document).ready(function(){
    $('div').click(function(){
        alert('TabName: ' + this.id);
    });
});

这将完成您希望问题中的代码执行的所有操作

---

在实际情况下，您可能需要给div一个公共类（例如

toClick

），然后使用jQuery类选择器（

$（'.toClick'）

）。

您的问题在代码的这一部分：

for (i in myObjToTest) {
    $('#' + myObjToTest[i].TabName).click(function() {
        TestResult('TabName: ' + myObjToTest[i].TabName);
    });
}

问题在于

i

的值没有硬编码到该部分中。当函数运行时，它将查看

i

的当前值。由于您已将其递增以引用第二个选项卡，因此此函数将始终引用第二个选项卡。Javascript的这个特性称为闭包——它以

i

的值关闭

最简单的方法是使用jQuery一次绑定到多个对象，然后根据单击的对象进行计算：

$(document).ready(function(){
    $('div').click(function(){
        alert('TabName: ' + this.id);
    });
});

这将完成您希望问题中的代码执行的所有操作

---

在现实世界中，您可能需要给div一个公共类（例如，

toClick

），然后使用jQuery类选择器（

$（'.toClick'）

）。

为什么这会继续产生错误的值：函数TestWhatIsGoingOn（myObjToTest）{for（i In myObjToTest）{var tn=myObjToTest[i].TabName；$（'#'+tn）.单击（function（）{TestResult（'TabName:'+tn）；}}}}}谢谢，在阅读了闭包之后，我可以看出问题所在。为什么这会继续产生错误的值：function TestWhatIsGoingOn（myObjToTest）{for（myObjToTest中的I）{var tn=myObjToTest[I].TabName；$（'#'+tn）.单击（function（）{TestResult（'TabName:'+tn）；}}}}}谢谢，在阅读了闭包之后，我看到了问题所在。感谢您的回复，这是解决问题的另一种方法。我试图构建一个插件，并让用户通过div的id数组来使用。在谷歌上阅读关于关闭的文章，我可以看出我错在哪里了。干杯感谢您的回复，这是解决问题的另一种方法。我试图构建一个插件，并让用户通过div的id数组来使用。在谷歌上阅读关于关闭的文章，我可以看出我错在哪里了。干杯