Question

我有许多单选按钮，带有“是”或“否”选项。

jQuery是否有一种简单的方法来检查它们是否都选择了“是”？

HTML是：

<input type="radio" id="yes1" name="group1" value="yes">Yes<br>
<input type="radio" name="group1" value="No">No<br>
<hr>
<input type="radio" id="yes2" name="group2" value="yes">Yes<br>
<input type="radio" name="group2" value="No">No<br>
<hr>
<input type="radio" id="yes3" name="group3" value="yes">Yes<br>
<input type="radio" name="group3" value="No">No<br>

我猜它有点像

yes1 = $("#yes1").prop("checked", true);
yes2 = $("#yes2").prop("checked", true);
yes3 = $("#yes2").prop("checked", true);

if (yes1 & yes2 & yes3) {
   // do something ?
}

Answer 1

您可以将带有['value=yes]的元素的长度与带有['value=yes]和属性:checked的元素进行比较：

 if($('[value=yes]').length==$('[value=yes]:checked').length){
     //all yes elements are checked
 }

Answer 2

一种方法是检查是否检查了值为yes的所有无线电

if($('input[type="radio"][value="yes"]').not(':checked').length == 0){
    //all checked
}

Answer 3

您可以使用value != true检查单选按钮的数量。如果计数为零，则将选择所有单选按钮。

if(!$('input[type="radio"][value="yes"]').not(':checked').length){
//select all radio buttons with value = yes
}

Answer 4

<!DOCTYPE html>
<html>

<head>
  <title></title>

</head>

<body>
  <input type="radio" id="yes1" name="group1" value="yes">Yes
  <br>
  <input type="radio" name="group1" value="No">No
  <br>
  <hr>
  <input type="radio" id="yes2" name="group2" value="yes">Yes
  <br>
  <input type="radio" name="group2" value="No">No
  <br>
  <hr>
  <input type="radio" id="yes3" name="group3" value="yes">Yes
  <br>
  <input type="radio" name="group3" value="No">No
  <br>
  <input type="button" id="btn" value="Test" />

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $("#btn").click(function() {
        var length = 3;
        var isChecked = true;
        for (var i = 1; i <= length; i++) {
          isChecked = isChecked && ($("#yes" + i).is(":checked"));
        }
        if (isChecked)
          alert("All are checked");
        else
          alert("All are not checked");
      });
    });
  </script>

</body>

</html>

Answer 5

<input type="radio" id="yes1" name="group1" value="yes" checked>Yes<br>
<input type="radio" name="group1" value="No">No<br>
<hr>
<input type="radio" id="yes2" name="group2" value="yes" checked>Yes<br>
<input type="radio" name="group2" value="No">No<br>
<hr>
<input type="radio" id="yes3" name="group3" value="yes" checked>Yes<br>
<input type="radio" name="group3" value="No">No<br>


var yes1 = $("#yes1").is(":checked")
    var yes2 = $("#yes2").is(":checked")
    var yes3 = $("#yes3").is(":checked")
    //$("#Myradio").is(":checked")

    if (yes1 & yes2 & yes3) {
        alert('sasa');
       //do something
    }

FIDDLE

Answer 6

<!DOCTYPE html>
<html>

<head>
  <title></title>

</head>

<body>
  <input type="radio" id="yes1" name="group1" value="yes">Yes
  <br>
  <input type="radio" name="group1" value="No">No
  <br>
  <hr>
  <input type="radio" id="yes2" name="group2" value="yes">Yes
  <br>
  <input type="radio" name="group2" value="No">No
  <br>
  <hr>
  <input type="radio" id="yes3" name="group3" value="yes">Yes
  <br>
  <input type="radio" name="group3" value="No">No
  <br>
  <input type="button" id="btn" value="Test" />

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $("#btn").click(function() {
        var length = 3;
        var isChecked = true;
        for (var i = 1; i <= length; i++) {
          isChecked = isChecked && ($("#yes" + i).is(":checked"));
        }
        if (isChecked)
          alert("All are checked");
        else
          alert("All are not checked");
      });
    });
  </script>

</body>

</html>

如何检查是否已选中所有单选按钮

6 个答案: