2

我创建了波纹管表单验证脚本,但每次“未选择项目”时都无法正常工作。有什么问题你能帮我解决这个问题吗?

我的代码:

<script type="text/javascript">
function ValidateSchool(form){
    var cat_school = document.getElementsByName('school[]');    

    for (i = 0; i < cat_school.length; i++){
        if (cat_school[i].checked == true){
            return true;
        }else{
            alert('No item selected');
            return false;
        }
    }
}
</script>

<form name="frm" method="post" action="#" onsubmit="return ValidateSchool(this)">
  <div class="TopAlphaWrapper">
    <div id="topMainAlpha">
      <div id="TopAlphaOneLeft">
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Primary School" style="display: block;">
          <label id="lbl_type0" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.442917,103.799744" type="checkbox">
            Admiralty Primary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Secondary School" style="display: block;">
          <label id="lbl_type1" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.446367,103.801608" type="checkbox">
            Admiralty Secondary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Advent Learning" style="display: block;">
          <label id="lbl_type2" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.324952,103.851188" type="checkbox">
            Advent Learning</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="AEC Business School" style="display: block;">
          <label id="lbl_type3" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.282717,103.818904" type="checkbox">
            AEC Business School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Primary School " style="display: block;">
          <label id="lbl_type4" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.43367,103.832723" type="checkbox">
            Ahmad Ibrahim Primary School </label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Secondary School" style="display: block;">
          <label id="lbl_type5" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.436482,103.829649" type="checkbox">
            Ahmad Ibrahim Secondary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ai Tong School" style="display: block;">
          <label id="lbl_type6" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.360415,103.832615" type="checkbox">
            Ai Tong School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Al-Mubarakah Tuition Centre" style="display: block;">
          <label id="lbl_type7" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.352244,103.954274" type="checkbox">
            Al-Mubarakah Tuition Centre</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Alps Academia" style="display: block;">
          <label id="lbl_type8" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.33079,103.9485" type="checkbox">
            Alps Academia</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="American College" style="display: block;">
          <label id="lbl_type9" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.280777,103.805617" type="checkbox">
            American College</label>
        </div>
      </div>
    </div>
  </div>

  <input type="submit" name="submit" value="Submit" />
</form>

有什么想法或建议吗?谢谢。

4

3 回答 3

4

您的验证逻辑似乎有缺陷,据我所知,您想检查是否至少检查了一项

function ValidateSchool(form) {
    var cat_school = document.getElementsByName('school[]');

    var valid = false;
    for (i = 0; i < cat_school.length; i++) {
        if (cat_school[i].checked == true) {
            valid = true;
            break;
        }
    }

    if (!valid) {
        alert('No item selected');
    }

    return valid;
}

问题是您的逻辑是,如果未选中第一个复选框,则您将显示警报并返回 false,而不是循环遍历列表的其余部分以查看是否选中了任何其他项目

于 2013-08-31T07:01:01.780 回答
0

试试这个:-

<script type="text/javascript">
function ValidateSchool(form) {
    var cat_school = document.getElementsByName('school[]');

    var valid = false;
    for (i = 0; i < cat_school.length; i++) {
        if (cat_school[i].checked == true) {
            valid = true;
            break;
        }
    }

    if (!valid) {
        alert('No item selected');
    }

    return valid;
}
</script>

<form name="frm" method="post" action="#" onsubmit="return ValidateSchool(this)">
  <div class="TopAlphaWrapper">
    <div id="topMainAlpha">
      <div id="TopAlphaOneLeft">
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Primary School" style="display: block;">
          <label id="lbl_type0" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.442917,103.799744" type="checkbox">
            Admiralty Primary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Secondary School" style="display: block;">
          <label id="lbl_type1" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.446367,103.801608" type="checkbox">
            Admiralty Secondary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Advent Learning" style="display: block;">
          <label id="lbl_type2" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.324952,103.851188" type="checkbox">
            Advent Learning</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="AEC Business School" style="display: block;">
          <label id="lbl_type3" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.282717,103.818904" type="checkbox">
            AEC Business School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Primary School " style="display: block;">
          <label id="lbl_type4" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.43367,103.832723" type="checkbox">
            Ahmad Ibrahim Primary School </label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Secondary School" style="display: block;">
          <label id="lbl_type5" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.436482,103.829649" type="checkbox">
            Ahmad Ibrahim Secondary School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ai Tong School" style="display: block;">
          <label id="lbl_type6" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.360415,103.832615" type="checkbox">
            Ai Tong School</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Al-Mubarakah Tuition Centre" style="display: block;">
          <label id="lbl_type7" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.352244,103.954274" type="checkbox">
            Al-Mubarakah Tuition Centre</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="Alps Academia" style="display: block;">
          <label id="lbl_type8" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.33079,103.9485" type="checkbox">
            Alps Academia</label>
        </div>
        <div class="email_alert_checkbx_list filter-div ln-a" data-filter="American College" style="display: block;">
          <label id="lbl_type9" class="label_check c_off" name="school" style="width:230px !important;">
            <input name="school[]" class="chkBX" value="1.280777,103.805617" type="checkbox">
            American College</label>
        </div>
      </div>
    </div>
  </div>

  <input type="submit" name="submit" value="Submit" />
</form>

希望它有效:)

于 2013-08-31T07:05:26.017 回答
0

在您的 checkBox 的第一个值的代码中,只有 return 语句被执行,这只是问题所在

试试这个小提琴

 function ValidateSchool(form){
var cat_school = document.getElementsByName('school[]');  
var j=0;

for (i = 0; i < cat_school.length; i++){

    if (cat_school[i].checked){
        j++;
    }
}
if(j>0){
    alert("item selected");
    return true;
}
else{
    alert("select atleast one value");
    return false;
}

}

于 2013-08-31T07:11:20.680 回答