javascript - 如何禁用 MC 表单的提交按钮？

Question

我必须用单选按钮做一个 MC 问题。每个问题都必须是只能选择一个答案。每个问题都有三个选项。我想检查用户是否回答了每个问题。如果是，可以提交按钮。如果否，请禁用提交按钮。这是我的代码：

<form name ='form' method ='post' action ='getResult' id ='form'>
      Q1. XXXXXXXXXX
      <br>
      <Input type = 'Radio' Name ='option_1' value= '1'> A1 <br>
      <Input type = 'Radio' Name ='option_1' value= '2'> A2 <br>
      <Input type = 'Radio' Name ='option_1' value= '3'> A3 <br>
      Q2. XXXXXXXXXX
      <br>
      <Input type = 'Radio' Name ='option_2' value= '1'> A1 <br>
      <Input type = 'Radio' Name ='option_2' value= '2'> A2 <br>
      <Input type = 'Radio' Name ='option_2' value= '3'> A3 <br>

      <Input type = 'Reset' Name = 'Reset' VALUE = 'Reset'>
      <Input type = 'Submit' Name = 'submitorder' VALUE = 'Submit' id='submitorder' disabled='disabled'>

                </form>

我只是把问题的内容、答案和按钮的价值简单化了。

Answer 1

尝试这个

    $(function(){
      $("input[type='radio']").change(function () {
      the_value = getChecklistItems();      
      if(the_value=="2")  
         $("#submitorder").removeAttr('disabled');
      else
         $("#submitorder").prop('disabled',true);  
    });
      $("#reset").click(function(){
          $("#submitorder").prop('disabled',true);
      });
  });

function getChecklistItems() {
    var count=0;
    var result = 
        $("input:radio:checked").get();

    var columns = $.map(result, function(element) {
        count=count+1;
    });

    return count;
}

HTML 更改，为重置按钮分配一些 id，如下所示：

 <Input type = 'Reset' Name = 'Reset' id="reset" VALUE = 'Reset'>

演示