javascript - 为什么这个 jquery 事件处理程序没有按预期连接？

Question

我有一个名称为“ReportTypeId”的单选按钮列表。对于每个 radio 按钮，我想在单击它时显示一个警报及其值。

我编写了以下 jQuery，它获取名称为“ReportTypeId”的列表中的所有 5 个单选按钮:

$("[name='ReportTypeId']").toArray().forEach(function(reportTypeId){
    reportTypeId.click(function(reportTypeId){
       alert(reportTypeId.value);
    });
});

当我设置断点并在加载时检查变量时，变量看起来与预期一致。但是，当我在页面加载后单击单选按钮时，什么也没有发生。我在上面的 jquery 中做错了什么？

Answer 1

您应该使用 this 将回调函数内的当前元素获取到 .click()。传递给函数的参数实际上是点击事件对象。

$("[name='ReportTypeId']").toArray().forEach(function(reportTypeId){
    reportTypeId.click(function(event){
        alert(this.value);
    });
});

<小时/>

只需在 jQuery 集合上调用 .click() 即可大大简化代码。事件监听器将自动附加到集合中的所有元素。

$("[name='ReportTypeId']").click(function(event){
    alert(this.value);
});