我有一个表单,用户可以在其中注册时事通讯,但我无法正确提交。
当我单击提交按钮时,我收到一条警报,指出"失败",因此 ajax 请求将直接进入 ajax 请求中的错误范围。
在我的 php 中,我获取所有 $_POST 变量并将它们插入数据库,我知道脚本正在工作。 我只想将消息返回到 ajax 成功状态,以便可以将消息显示给用户。
我到处寻找解决方案,但找不到。
<?php
echo "done";
?>
和带有jQuery的表单
<html>
<head>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#mlbutton').click(function() {
var name = $('#mlName').val();
var email = $('#mlEmail').val();
$.ajax({
type:'POST',
url: 'storeAddress.php',
data:$('#addressform').serialize(),
success: function(response) {
$('#addressform').find('#response').html(response);
alert(response);
},
complete: function() {
$('#addressform').each(function() {
this.reset();
});
},
error: function(){
alert('failure');
}
});
});
});
</script>
</head>
<body>
<form id="addressform">
<div class="textl1"><label id="namLbl" for="mlName">Name</label><input type="text" id="mlName" name="mlName" /></div>
<div class="textl1"><label id="emlLbl" for="mlEmail">Email</label><input type="text" id="mlEmail" name="mlEmail" /></div>
<div class="textr1"><input type="submit" id="mlbutton" name="mlbutton" value="dffhfdh" class="button-signup" /></div>
<p id="response" style="text-align: left"> </p>
</form>
</body>
</html>
更新
添加了 e.preventDefault();//call 防止默认事件
这现在停止了失败消息,但似乎没有调用 php 文件。我已经测试了php文件,因为没有提供电子邮件地址,我收到了我期待的消息。如果我只是单击表单而不输入电子邮件地址,我期待相同的消息,但什么都没有。如果我输入了电子邮件地址,我希望电子邮件在数据库中,但没有任何反应。就像没有调用 php 文件
可以阻止表单的默认操作。
$('#mlbutton').click(function(e) { //added event as argument
e.preventDefault(); //call prevent default on event
var name = $('#mlName').val();
var email = $('#mlEmail').val();
$.ajax({
type:'POST',
url: 'storeAddress.php',
data:$('#addressform').serialize(),
success: function(response) {
$('#addressform').find('#response').html(response);
alert(response);
},
complete: function() {
$('#addressform').each(function() {
this.reset();
});
},
error: function(){
alert('failure');
}
});
});
您需要阻止按钮提交页面,以便 AJAX 可以运行。
$('#mlbutton').click(function(e) {
e.preventDefault();
....