AJAX按钮没有提交,也没有通过
AJAX button not submitting and not going through
我遇到一个问题,我的Ajax代码无法通过。。就好像函数是空的一样。我点击了提交,什么也没发生。。
我的HTML代码:
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<body>
<form method="POST" id="contactForm" >
<input type="text" name="email" id="email"></input>
<input type="submit" name="submit"></input>
</form>
<script type="text/javascript">
$('#contactForm').submit(function(e){
e.preventDefault();
var email = $('#email').val();
$.ajax({
type: 'POST',
dataType: 'JSON',
url: 'check.php',
data: {email: email},
success: function(data){
if(data.status == 'success') {
alert('The e-mail address entered is correct.');
} else {
alert('The e-mail address entered is Incorrect.');
}
}
});
});
</script>
</body>
</head>
我的支票.php:
<?php
if (isset($_POST['email'])) {
$status = 'success'
} else {
$status = 'failed';
}
echo json_encode(array('status' => $status));
?>
当我点击提交时,它什么也不做。。我想弹出错误。
我错过了什么吗?
请确保传递到ajax调用的所有选项都有正确的大小写。示例:数据类型需要变为datatype,beforesend需要变为beforesend。
以下是参考资料:http://api.jquery.com/jquery.ajax/
括号放错了位置,您缺少一个表示"success"回调的:
。参见下面的固定代码,
这里的另一个答案中也提到了这种情况。。
$('#contactForm').submit(function () {
var email = $('#email').val();
$.ajax({
type: 'GET',
dataType: 'json',
url: 'check.php',
beforeSend: function () {},
// v--- missing :
success: function (data) {
if (data.status == 'success') {
alert('The e-mail address entered is correct.');
} else if (data.status !== 'success') {
alert('The e-mail address entered is wrong.');
}
} // this was misplaced in the line below in your code
}); // this was misplaced in the line above in your code
});
尝试使用Firefox或Chrome的开发工具进行调试。
在Chrome的DevTools上,例如:
- 使用source选项调试Javascript。或者在.submit()函数中冷添加一些
console.log()
,以确保事件处理程序正在触发 - 使用"网络"选项卡确保正在进行ajax调用,并检查您从服务器得到的响应
- 最后但同样重要的是,检查控制台选项卡中的Javascript错误,看看在执行脚本之前是否有其他脚本抛出错误
有了这些技术,您可以确定可能出现的问题,并了解如何解决。
相关文章:
- 带有验证和隐藏字段值的提交按钮
- 如何在 API 调用后和 if 语句中启用提交按钮
- 提交按钮,该按钮位于使用 Excel VBA 的 Javascript 中
- 如何使用提交按钮搜索表中的记录
- 在单击按钮前后禁用提交按钮
- 在表单完成并确认密码之前,请禁用提交按钮
- 如何使用Java脚本创建提交按钮's的拖放功能
- 如何在单击“提交”按钮时为“新建”窗口编写JavaScript,用“确定”和“取消”显示注册信息
- 提交按钮通过JQuery和JavaScript函数所做的更改不会持续
- 从输入时提交到jQuery,无需提交按钮,无需表单操作
- onclick提交按钮JSP
- 通过提交按钮传递值
- 如果ng单击附加到提交按钮,则表单未验证
- 如何在Razor MVC 5.2.3 Ajax中使用多个提交按钮
- 使用提交按钮隐藏未选中的单选按钮
- Ruby/JS如何在提交按钮后重新加载页面
- JavaScript表单提交没有't fire asp服务器端点击功能的提交按钮
- 使用javascript后,提交按钮不起作用
- 如何使用jQuery/Ajax响应特定的提交按钮
- 表单中的提交按钮在 PHP 打印中不起作用