使用Jquery限制和验证复选框

时间:2015-02-26 15:40:29

标签: javascript jquery html validation

JS:

<script type="text/javascript">
  function validateitem(){
    var items = document.forms['mba'];
    var inc = 0;
    var i;
    for (i = 0; i < items.length; i++) {
      if (items[i].checked) {
        inc++;
      }
    }
    if(inc == 0) {
      document.getElementById("limitmsg").innerHTML = 'Select atleast 1 item.';
      return false;
    } else if(inc<5) {
      document.getElementById("limitmsg").innerHTML = 'You can select only 5 items.';
      return false;
    }
  }
</script>

HTML:

<html>
<head>
    <title>survey </title>
</head>
<body>
<form method="post" novalidate action="mba.php" name="mba" onsubmit="return validateitem();">
    <table>



    <tr>
        <th colspan="2"><p>INPUT QUESTION 1<span class="">*</span></p></th>
    </tr>
    <tr>
        <td><label class="" for=""><input type="checkbox" id="q3401" name="q34[]" value="q3401" class="" aria-required="true" />Tradition of excellence</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3402" name="q34[]" value="q3402" class="" aria-required="true" />Quality education</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3403" name="q34[]" value="q3403" class="" aria-required="true" />Proximity to residence</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3404" name="q34[]" value="q3404" class="" aria-required="true" />Proximity to work</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3405" name="q34[]" value="q3405" class="" aria-required="true" />Affordability/reasonablility of school fees</label></td>
    </tr>

    <tr>
         <th colspan="2"><p>INPUT QUESTION 2<span class="">*</span></p></th>
    </tr>
    <tr>
        <td><label class="" for=""><input type="checkbox" id="q3501" name="q35[]" value="q3501" class="" aria-required="true" />Earn a widely-organized credential</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3502" name="q35[]" value="q3502" class="" aria-required="true" />Not employed</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3503" name="q35[]" value="q3503" class="" aria-required="true" />No work opportunity</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3504" name="q35[]" value="q3504" class="" aria-required="true" />Be able to teach in a college or university</label></td>
        <td><label class="" for=""><input type="checkbox" id="q3505" name="q35[]" value="q3505" class="" aria-required="true" />For higher/competitive salary</label></td>
    </tr>




    <tr>
        <th colspan="2"><p>INPUT QUESTION 3<span class="">*</span></p></th>
        <td>
            <label class="" for=""><input type="radio" id="mbayes1" name="mba[]" value="mbayes1" class=" " aria-required="true" />Yes</label>
            <label class="" for=""><input type="radio" id="mbano1" name="mba[]" value="mbano1" class="" aria-required="true" />No</label>
        </td>
    </tr>



</table>
</form> 
</body> 
</html>

问题:如何使用Jquery验证每个问题的复选框?

检查上面的HTML代码:

我有我的Jquery验证,但它只适用于每个表单,它限制了整个表单。我需要对每个问题进行验证。

例如:

q34 [] = 5如果没有检查,验证消息

q35 [] = 5如果没有检查,验证消息

q36 [] = 1如果没有检查,验证消息

0 个答案:

没有答案