Question

我在使用JQuery处理多个单选按钮组时遇到问题。由于某种原因，JQuery代码无法分辨出两组单选按钮之间的区别，也无法分辨出我点击的哪一组单选按钮。

以下是HTML代码：

<!-- Radio button group 1 -->
<input type="radio" name="group_1" value="full_day_ticket"/>
<input type="radio" name="group_1" value="half_day_ticket"/>

<!-- Radio button group 2 -->
<label><input type="radio" name="group_2" value="boarder"/> Snowboard</label>
<label><input type="radio" name="group_2" value="skier"/> Ski</label>

JQuery代码如下：

$("input:radio[@name='group_2']").click(function() {
  alert('group 2 clicked');
}

现在当我点击名为'group_1'的单选按钮时，JQuery认为我点击'group_2'中的单选按钮并显示警告窗口。出于某种原因，似乎JQuery没有识别@ name ='group_2'过滤器并捕获页面上所有单选按钮的点击，而不仅仅是名为'group_2'的单选按钮。

以前有人遇到过这个问题吗？或者我做了一些愚蠢的事情？

谢谢！

Answer 1

请注意，在jQuery 1.3 [@attr]中，样式选择器已被删除。

如果删除@符号，选择器将按预期工作。

但您实际上可以处理两个组的点击事件：

$("input:radio").click(function() {
  if (this.name == "group_1") {
    // group 1 clicked
  } else if (this.name == "group_2") {
    // group 2 clicked
  }
});

Answer 2

一个小改动将解决它：

$("input:radio[name=group_2]").click(function() {
  alert('group 2 clicked');
});

JQuery和多个单选按钮组问题

2 个答案: