如何禁用MC表单的提交按钮?

时间:2013-07-02 09:54:09

标签: javascript jquery

我必须用单选按钮做一个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>

我只是简单地说明问题的内容,答案和按钮的价值。

1 个答案:

答案 0 :(得分:0)

试试这个

    $(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'>

Demo