[英]Prevent default not working in ajax form submit
我在实现此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>
你应该使用
<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(){
});
您的HTML中有两个ID
<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>
你可以试试这个
$(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');
}
}
});
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.