jquery 检查收音机输入不工作

Question

我在尝试使用 JQuery 检查无线电输入时遇到问题。我才刚刚开始学习，请多多包涵。

我有 4 个单选按钮，我希望它们能够通过点击滚动。问题是我只能让第一个 if 语句起作用。这是我的 html：

<a class="back"> < </a>
  <input type="radio" name="radio-control" id="radio-1" checked="checked"/>
  <input type="radio" name="radio-control" id="radio-2"/>
  <input type="radio" name="radio-control" id="radio-3"/>
  <input type="radio" name="radio-control" id="radio-4"/>
<a class="next"> > </a>

和我的 JQuery:

if($('#radio-1').is(':checked')) { 
  $('.next').click(function() {
    $("#radio-2").prop("checked", true)
  });
}
if($('#radio-2').is(':checked')) { 
  $('.next').click(function() {
    $("#radio-3").prop("checked", true)
  });
  $('.back').click(function() {
    $("#radio-1").prop("checked", true)
  });
}
});

在 codepen 上：http://codepen.io/anon/pen/LpGOqq

如果有人可以提供一些意见，我们将不胜感激。

Answer 1

检查 checked 状态然后绑定事件是一种肮脏的方式。

您可以为 prev/next 按钮设置简单的点击事件，您可以在其中定位选中的单选元素的 prev/next 元素并将其设置为 true。像这样：

$('.next').click(function () {
    $(":checked").next().prop("checked", true)
});
$('.back').click(function () {
    $(":checked").prev().prop("checked", true)
});

Working Demo

jquery 检查收音机输入不工作

jquery checking radio input not working

html

jquery

radio-button