AJAX调用PHP文件不起作用

Question

我正在练习对本地主机执行简单的AJAX调用，但是遇到了麻烦。 我想做的是将两个文本框表单值发送到PHP，然后在通过AJAX成功接收后让它在我的表单中将消息返回到空div。 我的test.php是这样的：

<?php

$num = htmlentities(substr($_POST["num"], 0, 7), ENT_QUOTES);
$name = htmlentities(substr($_POST["name"], 0, 50), ENT_QUOTES);

$result = "'$num ' + 'and' + ' $name' + ' values have been successfully AJAXd'";

echo json_encode($result);

jQuery的：

  $("#form").submit(function() {
    event.preventDefault();
    $("#msgcontainer").html("");
    $.ajax({
    url: "test.php",
    data: ("#num").serialize(), ("#name").serialize(),
    contentType: "application/json; charset=utf-8",
    type: "POST",   
    dataType: "json"
      success: function(response) {
        $("#msgcontainer").html(response);
      }
    });
  }

当我尝试提交时，页面只是重新加载并将表单值添加到URL。 我已经尝试解决这一问题了大约一天，因此我们将不胜感激。

编辑：

我通过尝试每个响应中的内容来弄清楚。 不知道为什么不序列化就可以工作...如果有人知道，请解释。 有效的jQuery代码：

  $("#form").submit(function(event) {
    event.preventDefault();
    $("#msgcontainer").html("");
    $.ajax({
    url: "test.php",
    data: {
            num: $("#num").val(),
            name: $("#name").val()
          },
    type: "POST",
    dataType: "json",
      success: function(response) {
        $("#msgcontainer").html(response);
      }
    });
  });

感谢您的帮助！

Answer 1

立即有两件事脱颖而出：

data: ("#num").serialize(), ("#name").serialize(),
contentType: "application/json; charset=utf-8",

第一个应该是这样（假设您有两个文本框）：

data: {
    num: $('#num').val(),
    name: $('#name').val()
},

而且contentType:行不应存在，否则您将有一个空的$_POST 。

最后， event应该是一个函数参数，即：

$("#form").submit(function(event) {
    event.preventDefault();
    // ...

Answer 2

您的AJAX调用中的数据参数有误，应为：

data: { num: $('#num').val() , name: $('#name').val() }

Answer 3

$("#form").submit(function() {
  event.preventDefault();

event未在任何地方定义。 我猜你的意思是...submit(function(event) { 。

您应该在JavaScript控制台中看到一个错误，告诉您“未定义事件”或“ TypeError：无法读取未定义的属性'preventDefault'”。

Answer 4

数据发送不正确。 考虑更换：

data: ("#num").serialize(), ("#name").serialize(),

带有：

data: $(this).serialize(),

然后，您可能需要编辑PHP脚本，以便将字符串concatenate而不是summing 。

还可以传递event参数或直接使用以下内容：

$("#form").submit(function() {
    var event = arguments[0];
    event.preventDefault();
    ....
});

我怀疑您是否需要contentType: "application/json; charset=utf-8",

Answer 5

早上好，

您必须序列化整个表格，例如：

$("#yourform").serialize();

而不只是逐个字段：

("#num").serialize(), ("#name").serialize()