我正在尝试使用 jQuery 将发布数据发送到名为 postinfo.php
的发布数据文件处理程序,但到目前为止我可以做到。
这是我的 post.php 代码:
<HTML>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<script type="text/javscript">
$('#form_id').on('submit', function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: "http://www.vemvo.com/test/postinfo.php",
data: $(this).serialize(),
success: function() {
alert('success');
}
});
});
</script>
<form method="post" id="form_id">
<input type="text" name="ime">
<input type="submit" id="submit" name="submit" value="Send">
</form>
您可以在此处查看页面:http://www.vemvo.com/test/post.php
这是我的 postinfo.php 中的代码:
<?PHP
$ime = $_POST['ime'];
echo "Your name is $ime";
?>
这里位于 postinfo.php - http://www.vemvo.com/test/postinfo.php
那么我的错误在哪里以及如何让它发挥作用? 现在它不发送数据,也不给我成功警报。
最佳答案
您的 jQuery 选择器不会找到该表单,因为选择器在 DOM 中存在 form
标记之前运行。尝试将其包装在 jQuery 函数中以等待文档准备就绪:
$(function () {
$('#form_id').on('submit', function(e){
// the rest of your code
});
});
最后返回 false
也可能是一个好主意,以进一步抑制表单的默认发布操作:
e.preventDefault();
$.ajax({
type: "POST",
url: "./postinfo.php",
data: $(this).serialize(),
success: function() {
alert('success');
}
});
return false;
目前表单正在正常发布。由于 AJAX 处理程序从未附加(因为选择器执行时该元素不存在),因此它只是执行正常的文档级表单发布。由于 form
标记中没有指定 action
属性,因此页面默认情况下会向自身发布。它仅响应当前页面。
编辑:您还有一个拼写错误,可能会阻止浏览器执行您的 JavaScript 代码:
<script type="text/javscript">
你漏掉了第二个“a”。这应该是:
<script type="text/javascript">
关于javascript - 使用 Jquery 将 HTML 表单发布数据发送到文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19476992/