Question

我有一个类似下面的表格：

<form id="myForm">
      Question 1:<br>
      <input type="radio" name="question1" value="Yes"> Yes
      <input type="radio" name="question1" value="No"> No
      <br>
      Question 2:<br>
      <input type="radio" name="question2" value="Yes"> Yes
      <input type="radio" name="question2" value="No"> No
      <br>
      Question 3:<br>
      <input type="radio" name="question3" value="Yes"> Yes
      <input type="radio" name="question3" value="No"> No
      <br>
      <input type="submit" value="Submit" name="submit">
</form>

我希望使用jQuery从所有问题中获取所有选定的单选按钮值，如果所有值都等于“是”，它将提醒成功，否则它将提示失败。

这是我写的jQuery：

$(document).ready(function(){
   $("#myForm input[type=radio]:checked").each(function() {
       var value = $(this).val();
   });
});

Answer 1

您可以检查是否收到无线电检查，否则结果将失败，否则成功。

<强> Live Demo

result = "success";
$("#myForm input[type=radio]:checked").each(function() {
  if(this.value == "No" && this.checked == true)
  {
     result = "fail";
     return false;
  }
});
alert(result);

Answer 2

   $(document).ready(function(){
     var val=1;
       $("#myForm input[type=radio]:checked").each(function() {
            if($(this).val()=="No")
             {
              val=2;
             }
       });

      if(val==1)
      {
        alert("Success !!");
      }
      else{
        alert("Fail ");
      }
    });

Answer 3

$(document).ready(function(){
   var no_found=false;
   $("#myForm").submit(function(){
      $(this).find("input[type=radio]:checked").each(function() {
       var value = $(this).val();
       if(value == "No")
           no_found=true;
      });
      if(no_found==false){
       alert("Success");
      } 
      else{
       alert("Fail");
      }
   });
});

Answer 4

使用此代码：

$(function() {
  $('#myForm').on('submit', function(e) {
    e.preventDefault();

    var total = 0;
    $('#myForm input[type="radio"]:checked').each(function() {
      if ($(this).val() == 'Yes')
        total++;
    });
    if (total == 3)
      alert("Success");
    else
      alert("Fail");
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
  Question 1:
  <br>
  <input type="radio" name="question1" value="Yes" checked>Yes
  <input type="radio" name="question1" value="No">No
  <br>Question 2:
  <br>
  <input type="radio" name="question2" value="Yes">Yes
  <input type="radio" name="question2" value="No" checked>No
  <br>Question 3:
  <br>
  <input type="radio" name="question3" value="Yes">Yes
  <input type="radio" name="question3" value="No" checked>No
  <br>
  <input type="submit" value="Submit" name="submit">
</form>

Answer 5

试试此代码

$("#myForm").submit(function(){
    var check = "Yes";
    $(this).find("input[type=radio]:checked").each(function() {
     var value = $(this).val();
     if(value == "No")
      check = "No";
    });
    alert(check)
  });

Answer 6

你也可以试试这个：

http://codepen.io/anon/pen/JGeLMx

$('#myForm input[type="submit"]').on('click', function(e) {

  e.preventDefault();  

  var result = true;  
  $('input[type="radio"]').each( function() {

    var radio = $(this)[0];    
    if ( radio.value === 'Yes' && radio.checked === false )
      result = false;

  });

  if ( result ) {
    alert( 'Success!' );
  } else {
    alert( 'Fail!' );
  }

});

迭代了所有单选按钮，如果单独检查“否”＆＃39;或者根本没有被选中它会失败，否则，这将意味着所有＆＃39;是＆＃39;是检查 - 成功。

Answer 7

<!DOCTYPE html>
<html>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>


<script>
    $(document).ready(function () {

        $('input[type="radio"]').change(function () {
            var iCountTotal;
            var iCountCkedYes;
            iCountTotal = $('input[type="radio"]').length/2;
            iCountCkedYes = $('input[type="radio"][value="Yes"]:checked').length;
            if (iCountTotal != iCountCkedYes) {
                alert('fail')
            }
            else {
                alert('success')

            }
        });


    });


</script>



<body>

    <form id="myForm">
      Question 1:<br>
      <input type="radio" name="question1" value="Yes" checked="checked"> Yes
      <input type="radio" name="question1" value="No"> No
      <br>
      Question 2:<br>
      <input type="radio" name="question2" value="Yes"> Yes
      <input type="radio" name="question2" value="No" checked="checked"> No
      <br>
      Question 3:<br>
      <input type="radio" name="question3" value="Yes"> Yes
      <input type="radio" name="question3" value="No" checked="checked"> No
      <br>
      <input type="submit" value="Submit" name="submit">
</form>
</html>

Jquery - 遍历所有选中的单选按钮

7 个答案: