2011-11-18 56 views
1

alert()工作正常,但return false不停止表单被张贴 - 任何想法?JQuery手机 - 返回false不阻止表单提交

<script type="text/javascript"> 
function form_val() { 
    //Check date 
    var email=document.getElementById('email').value; 
    var passw=document.getElementById('password').value; 
    if(email==''||email==null||passw==''||passw==null) { 
     alert('Please fill in both fields.'); 
     return false; 
    } 

} 
</script> 

<form action="userlogin.html" method="post" name="log_form" onsubmit="return form_val();"> 
    <div data-role="fieldcontain"> 
     <input type="email" name="email" id="email" value="" placeholder="Email Address" /> 
     <input type="password" name="password" id="password" value="" placeholder="Password" /> 
     <div class="ui-grid-a"> 
     <div class="ui-block-a"> 
      <button type="submit" name="login" value="" data-theme="c">Sign In</button> 
     </div> 
     <div class="ui-block-b"> 
      <br /> 
      <a href="http://mobile.*****.com/lostpswd.html" rel="external" style="font-size:10px; padding-left:10px;">Forgotten Password?</a> 
     </div> 
    </div> 
</form> 

回答

2

您已经标记的问题jquery-mobile但你不能在引用代码的任何地方使用jQuery。

代码看起来在一个老式的DOM0的方式(这是可以的,应该仍然工作,除了issues with getElementById on IE7 and earlier除外)。我会改变的检查中form_val一点:

function form_val(){ 
    //Check date 
    var email=document.getElementById('email').value; 
    var passw=document.getElementById('password').value; 
    if(!email || !passw) { 
     alert('Please fill in both fields.'); 
     return false; 
    } 
} 

...但那些你已经大概应该有工作禁止未显示在代码页面上的上述或其他脚本错误列出的IE问题。

这里是你如何使用jQuery(其周围的IE漏洞自动为你工作)上述:

jQuery(function($) { 
    $("form[name='log_form']").submit(form_val); 
}); 
function form_val() { 
    if (!$("#email").val() || !$("#password").val()) { 
     alert('Please fill in both fields.'); 
     return false; 
    } 
} 

...或者,如果你不需要form_val是全球性的(避免全球功能如果可能的话,它并不需要是全球性只是为了验证这种形式):

jQuery(function($) { 
    $("form[name='log_form']").submit(form_val); 
    function form_val() { 
     if (!$("#email").val() || !$("#password").val()) { 
      alert('Please fill in both fields.'); 
      return false; 
     } 
    } 
}); 
+0

谢谢你的帮助,我学到了很多! –

0

你可以使用常规的“按钮”类型,而不是“提交”。然后调用您的JavaScript onclick来验证并提交表单。