2017-08-04 102 views
0

我在实现这个ajax的过程中尝试了我的最佳水平。我不是什么窗体的默认行为发生。我给予防止默认,但它不工作。我的页面表单没有提交Ajax。当我尝试点击,而不是提交验证码验证不工作。可以有人告诉这是什么错误。提前致谢。防止默认不在ajax表单中工作提交

$(document).ready(function() { 
 
    $("#login").submit(function(e) { 
 
    e.preventDefault(); 
 
    $.ajax({ 
 
     type: "POST", 
 
     url: "login.php", 
 
     data: $('#login').serialize(), 
 
     success: function(data) { 
 
     alert(data); 
 
     if (data == 'success') { 
 
      location.reload(); 
 
     } else { 
 
      $('#loginmsg').html(data).fadeIn('slow'); 
 
     } 
 
     } 
 

 
    }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<form action="<?php echo $root ?>login.php" id="login" method="post"> 
 
    <div id="loginmsg"></div> 
 
    <div class="form-group"> 
 
    <label for="login_email" class="sr-only">Email address</label> 
 
    <input name="email" type="email" class="form-control" id="login_email" placeholder="Email address"> 
 
    </div> 
 
    <div class="form-group"> 
 
    <label for="login_password" class="sr-only">Password</label> 
 
    <input name="password" type="password" class="form-control" id="login_password" placeholder="Password"> 
 
    </div> 
 
    <div class="form-group"> 
 
    <img src="common/captcha/captcha.php" id="captcha" height="50" /> 
 
    <a href="javascript:void(0)" onclick="document.getElementById('captcha').src='common/captcha/captcha.php?'+Math.random();document.getElementById('captcha-form').focus()" id=change-image title="Click here to refresh captcha code"><i class="fa fa-refresh refresh-sec"></i></a> 
 
    <div class="form-item inline"> 
 
     <div class="captcha-block"> 
 
     <p class="comment-form-captcha"><input name="captcha" type="text" id="captcha-form" autocomplete="off" class="form-text contact-captcha" maxlength="6" required="required" /></p> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <div class="text-center"> 
 
    <button type="submit" class="theme_button color1"> 
 
      Log in 
 
      </button> 
 
    </div> 
 
</form>

+0

看一看这样的:https://stackoverflow.com/questions/6462143/prevent-default-在form-submit-jquery –

+0

它不工作在我的情况下:( –

+0

@ freedomn -m为什么当'.submit()'应该工作得很好时,改变整个脚本的行为? @Sarath:尝试在你的'e.preventDefault();'之后加上'e.stopPropagation();'。 –

回答

1

你应该使用

<button type="button" class="theme_button color1">Log in</button> 

代替

<button type="submit" class="theme_button color1">Log in</button> 

和改变形式提交给

 $(document).on("click",".theme_button ", function(){ 


     }); 

你有两个ID在你的HTML

<a class="topline-button" id="login" data-target="#" href="./" data-toggle="dropdown" aria-haspopup="true" role="button" aria-expanded="false"> 
    <i class="fa fa-lock" aria-hidden="true"></i> Login 
</a> 


<form role="form" action="login.php" id="login" method="post"> 

</form> 
+0

无类型提交也我的表单正在提交 –

+0

答案更新。 – vel

+0

我已经尝试点击甚至。在这种情况下,我的验证码不起作用。 –

0

你可以试试这个

$(document).ready(function() { 
    $(document).on('click','#login' ,function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     type: "POST", 
     url: "login.php", 
     data: $('#login').serialize(), 
     success: function(data) { 
     alert(data); 
     if (data == 'success') { 
      location.reload(); 
     } else { 
      $('#loginmsg').html(data).fadeIn('slow'); 
     } 
     } 

    }); 
    }); 
}); 
+0

我已经尝试点击甚至。在这种情况下,我的验证码不起作用 –