Question

在我的mvc应用程序中，我将相同的功能绑定到这两个单选按钮。

$('#Fra').bind('change', function () {
    f_GC();
});

$('#Hea').bind('change', function () {
    f_GC();        
});

这几行的工作方式是Fra有2个具有相同名称/ ID的单选按钮（不同的值）。而Hea有4个单选按钮（不同的值），具有相同的名称/ ID ...

我的理解是所有属于Fra，/ Hea的ID都会绑定到函数...

这些工作时间最长，而且我必须更改一些代码....但是为了让所有6个单选按钮运行这些功能，我现在必须将它们绑定到这样..

$('input:radio[name=Fra][value=' + 1 + ']').bind('change', function () {
    f_GC();  
});
$('input:radio[name=Fra][value=' + 2 + ']').bind('change', function () {
    f_GC();  
});
$('input:radio[name=Hea][value=' + 1 + ']').bind('change', function () {
    f_GC();  
});
$('input:radio[name=Hea][value=' + 2 + ']').bind('change', function () {
    f_GC();  
});
$('input:radio[name=Hea][value=' + 3 + ']').bind('change', function () {
    f_GC();  
});
$('input:radio[name=Hea][value=' + 4 + ']').bind('change', function () {
    f_GC();  
});

对此行为有简单的解释吗？ Chrome调试工具在2个配置中都没有显示JS错误。

Answer 1

尝试按名称更新所有字段。

$('input:radio[name=Hea]').on('change', function () {
    f_GC();
});

可能有很多不同的方法可以做到，但这个方法可行：）

希望这有帮助。

Answer 2

jQuery doc says about ID selector： “每个id值必须在文档中只使用一次。如果为多个元素分配了相同的ID，则使用该ID的查询将只选择DOM中的第一个匹配元素。”

如果您不想更改ID，则另一个解决方案是将eventlistener添加到列表的父元素并使用“delegate”样式事件附件。然后在事件处理程序中，您可以查询触发事件的元素的id并相应地执行操作。

将脚本绑定到单选按钮：奇怪的行为：不按名称绑定

2 个答案: