getJSON 没有被正确调用

Question

我是初学者，请帮助我理解这一点。

我制作了这个示例测试代码： （存在于外部脚本文件中）

function validateForm()
{
     $.getJSON('database/grab_db.php', function(data) {
         alert("hello");
         return false;
        });
}

从表单中调用：

 <form id="form" action="users.php" method="post" onsubmit="return validateForm()">

另外，我在返回数据库的 php 文件中将内容类型更改为 JSON

header("Content-Type: application/json");

我知道问题在于validateForm() 方法和getJSON 没有被正确调用。尝试将alert() 放入validateForm()，在getJSON 之外，它运行良好。 另外，同源策略也不是这样，因为所有文件都是本地的。

提前致谢。

编辑：

最初return false; 语句在getJSON 之外。但是还是不行。

Answer 1

根据您在 cmets Uncaught ReferenceError: $ is not defined user_script.js:1 (anonymous function) 中提供的控制台错误，您似乎没有将 jQuery 库包含到包含此外部脚本文件的同一文件中。

请包含 jQuery，它应该可以工作。

Answer 2

validateForm 没有return 语句（您传递给getJSON 的函数中的那个是不同的函数）。

这意味着函数返回undefined。

这意味着您的事件处理函数也返回undefined。

这并没有停止提交事件的默认动作，所以表单仍然被提交。

由于 Ajax 是异步的，这意味着表单在 HTTP 响应返回并且回调函数运行之前提交。

Answer 3

$.getJSON 回调中的return false; 不会为validateForm 返回 false。

您可以将表单元素传递给validateForm 函数，如下所示：

html:

<form id="form" action="users.php" method="post" onsubmit="return validateForm(this);">    

js:

function validateForm(form)
{
     $.getJSON('database/grab_db.php', function(data) {
        // do some checking
        // if valid submit the form 
        form.submit(); 
     });
     // return false stop submitting the form
     return false;
}

Answer 4

你应该使用 $.ajax();在 jquery 中

<form id="form" action="users.php" method="post" onsubmit="return validateForm()">

脚本：

function validateForm()
{
$.ajax({
type:"post",
url: "<?php echo database/grab_db.php ?>",
cache: false,
data: $("form").serialize(),
success: function(data)  // return data
{
alert(data);
}
});
return false;
}

在grab_db.php文件中

<?php 
$data = //fetch data

echo json_encode($data);
?>