表单验证失败，但仍提出

我有以下JS代码：表单验证失败，但仍提出

function checkFull(id) { 
    var input = $('#' + id).val(); 
    if (input == "") { 
     return false; 
    } 
    else { 
     return true; 
    } 
} 

function checkSame(id1,id2) { 
    var input1 = $('#' + id1).val();  
    var input2 = $('#' + id2).val(); 
    if (input1 == input2) { 
     return true; 
    } 
    else { 
     return false; 
    } 
} 
function showErrors() { 
    if (!checkFull('username')) { 
     $('#userfield').show(); 
    } 
    else { 
     $('#userfield').hide(); 
    } 

    if (!checkFull('email')) { 
     $('#notsame').show(); 
    } 
    else { 
     $('#notsame').hide(); 
    } 

    if (!checkFull('confemail')) { 
     $('#notsame2').show(); 
    } 
    else { 
     $('#notsame2').hide(); 
    } 

    if (!checkFull('espncode')) { 
     $('#nocode').show();  
    } 
    else { 
     $('#nocode').hide();  
    } 

    if (notSame('email','confemail')) { 
     $('#notsame2').show(); 
     $('#notsame').show(); 
    } 
    else { 
     $('#notsame2').hide(); 
     $('#notsame').hide(); 
    } 
} 
function valform() { 
    showErrors(); 
    if (checkFull('username') && checkFull('email') && checkFull('confemail') && checkSame('email','confemail') && checkFull('espncode')) { 
     form.submit(); 
     alert('success'); 
    } 
    else { 

     return false; 
    } 
}

而下面的形式：

<form method="post" action="forms/post.asp" onsubmit="valform();return false"> 
      <strong>Poker Username</strong> <span id="userfield" style="display:none;color:#F00">*</span><br /> 
      <input type="text" name="username" id="username" style="width:230px;" /> 
      <br /><br /> 
      <div class="vert"> 
       <strong>Email Address</strong> <span id="notsame" style="display:none;color:#F00">*</span><br /> 
       <input type="text" name="email" id="email" style="width:230px;" /> 
      </div> 
      <div class="vert2"> 
       <strong>Confirm Email Address</strong> <span id="notsame2" style="display:none;color:#F00">*</span><br /> 
       <input type="text" name="confemail" id="confemail" style="width:230px;" /> 
      </div> 
      <div style="clear:both;"></div> 
      <div class="espn"> 
       <div class="txt"><strong>Enter the ESPN special code</strong></div> 
       <input type="text" name="espncode" id="espncode" style="width:230px;" /> 
      </div> 
      <div id="nocode" style="display:none"> 
       You need to enter the code above 
      </div> 
      <div class="tc"> 
       <input type="checkbox" id="agree" name="agree" /> <strong>You agree to the terms and conditions of this sweepstake. Only one entry per person per sweepstake period. Any additional entries will be disqualified.</strong> 
      </div> 
      <br /> 
      <div class="submit"> 
       <input type="image" src="submit_BTN.png" /> 
      </div> 
     </form>

即使我离开空白表单，当我按下提交它会去通过。这是为什么？

来源

2012-08-09 user838437

有没有您的验证工作？ – Prateek 2012-08-09 08:30:00

@pKs - yes运行showErrors（）时显示的'错误'正在瞬间显示，然后表单提交 – user838437 2012-08-09 08:30:46

您的前两个函数可以大大简化为[this]（https ：//gist.github.com/c6945009d34c9e1842c7） – elclanrs 2012-08-09 08:32:03

您需要从您的验证函数返回submit处理程序中的值：

onsubmit="valform();return false"

应该是：

onsubmit="return valform();"

每当valform返回false这将防止从形式提交。

顺便说一句，form.submit()呼叫您的valform函数是没有意义的。如果函数不返回false，它将被提交。

if (/*validity checks pass*/) { 
    alert('success'); 
} 
else { 
    return false; 
}

但是，通过您的代码with this fiddle找我注意到有一个错误：

ReferenceError: Can't find variable: notSame

如果您解决您的函数的名称，将工作。您应该使用可用的开发人员工具来调试此类小错误。 Firebug for Firefox和Chrome/Safari随附了一个内置的网络检查器。Opera也有Dragonfly。

来源

2012-08-09 08:34:22

谢谢，我刚刚尝试过，它仍然提交表单..任何想法？ – user838437 2012-08-09 08:37:45

错误可能在您的验证中。你确定它做你打算做的事情吗？ – 2012-08-09 08:39:28

我删除了form.submit（）从应该执行的部分，当窗体验证，并只留下一个“警报（”成功“）;''那里。当我提交表单时，我没有得到提示，但表单仍然提交，所以从我收集的内容中返回false，但仍然提交表单。 – user838437 2012-08-09 08:40:55

可能的原因：

onsubmit="valform();return false"变化onsubmit="valform();"形式。

尝试如果仍然没有工作，然后告诉。

来源

2012-08-09 08:41:49 Prateek

表单验证失败，但仍提出

回答

相关问题