-1

我编写了一段简单的 javascript 来验证复选框组。javascript 工作正常，但在 html 中正确实现它被证明是困难的。我的尝试要么导致表单被发送，尽管验证失败，或者没有提交按钮，但其他一切正常。有人能帮忙吗？谢谢

  <form id="form1" name="form1" method="get" action="pre_process.php">
        <input name="q" type="text" value="<?php echo $_GET['q']; ?>" size="67"/>



<input type="submit" id="search_button" onclick= "chkChecks()" />
/////this line of code submits the form even when the javascript returns false

<input class="submit" type="button" onclick="chkChecks()" />
///this code works, doesn't send the form, but also takes away my nice shiny submit button

  ///////js code/////
    function chkChecks(){
isChecked=false

for(var i=0;i<document.forms["form1"]["SearchEngines[]"].length;i++){
if(document.forms["form1"]["SearchEngines[]"][i].checked){
isChecked=true
}
}

if(isChecked){
document.forms["form1"].submit()
}
else{
alert('Please select at least one Search Engine')
return false;
}

}
</script>

////也是被验证的表单部分

<table width="200">
              <tr>
                <td><label>
                  <input type="checkbox" name="SearchEngines[]" value="Bing" id="SearchEngines_0" checked="checked" />
                  Bing</label></td>
              </tr>
              <tr>
                <td><label>
                  <input type="checkbox" name="SearchEngines[]" value="Blekko" id="SearchEngines_1" checked="checked"  />
                  Blekko</label></td>
              </tr>
              <tr>
                <td><label>
                  <input type="checkbox" name="SearchEngines[]" value="Entireweb" id="SearchEngines_2" checked="checked" />
                Entireweb</label></td>
              </tr>
4

3 回答 3

0

按钮不会提交表单 - 默认情况下它们不做任何事情。它们通常与 JavaScript 结合使用，作为 AJAX 应用程序的一部分。

按钮将在用户单击它们时提交它们所在的表单，除非您使用 JavaScript 另行指定。

检查 isChecked 变量是真还是假，如果它为假，则进行一些检查并使该变量为真。

if(isChecked !== true) { 
    for(var i=0;i<document.forms["form1"] ["SearchEngines[]"].length;i++){  
       if(document.forms["form1"]["SearchEngines[]"][i].checked){
          isChecked=true 
       }
    } 
 }
于 2012-07-21T01:54:04.210 回答
0 
<input class="submit" type="button" onclick="chkChecks()" />

您的函数chkChecks可能返回 false，但从属性创建的实际处理程序更像这样：

function(event) {
    chkChecks();
}

最好使用 JavaScript 附加事件处理程序，以便识别返回值：

document.getElementById("submitbutton").onclick = chkChecks;
于 2012-07-21T01:56:25.957 回答
0

您可以查看我在此处提交的答案：

如果表单未自动完成，是否有办法阻止提交表单？

这就是我完成表单验证的方式，还有其他工具也可以让您进行表单验证，但我想为什么不自己做，它更快更容易管理。

您可以自己在 html 上硬编码验证类，也可以在 $(document).ready 上使用 jquery 选择器

于 2012-07-21T01:56:40.140 回答