通过ajax向php脚本发送隐藏输入不起作用

Question

我正在尝试让我的 ajax/json 脚本工作，我查看了 stackoverflow，但找不到任何看起来有帮助的东西。基本上，我要做的就是当用户单击提交按钮时，将隐藏的输入值通过 ajax 发送到另一个 php 脚本，在那里它将被更改等等......然后通过 ajax 发回并显示在里面div 通过响应，我不确定我做错了什么。

目前我什么也没得到，没有输出或任何东西。

我会在下面给出的代码中尽可能详尽，感谢所有帮助。

主页上的 AJAX 脚本

<script>
$(document).ready(function () {
  $(".add_detail_land_down").click(function () {
    var hidden_count = $('input[name=addon_detail_hidden_count]').val();
    $.ajax({
      type: "GET",
      url: "ajax_script.php",
      data: {
        hidden_count: hidden_count
      },
      dataType: "json",
      statusCode: {
        success: function (data) {
          $("#total_hidden").html(data.total_hidden);
        }
      }
    });
  })
});
$(".add_detail_land_down").click();
</script>

主页上的表单头（我想我不妨添加它，以防万一）

<form action="" method="post">

主页面的隐藏输入

<input type="hidden" name="addon_detail_hidden_count" id="addon_detail_hidden_count" class="addon_detail_hidden_count" value="1" />

主页面上启动ajax进程的提交按钮

<input name="add_detail_land_down" type="submit" class="add_detail_land_down" value="add_detail_down"/>

ajax_script.php 中的代码

    <?php 

$hidden_count = $_GET["hidden_count"];

$hidden_count = $hidden_count + 1;
include 'connect_to_mysql.php';

echo json_encode(array("total_hidden" => $hidden_count ));

 ?>

感谢大家的帮助

Answer 1

为什么要将success callback 嵌套在 statusCode

中

应该是

dataType: "json",
success: function (data) {
    $("#total_hidden").html(data.total_hidden);
}

或

使用状态码 200 而不是 success

dataType: "json",
statusCode: {
     200 : function (data) {
          $("#total_hidden").html(data.total_hidden);
     }
}

Answer 2

在提到的所有其他问题中：statusCode/success 语法问题，以及document.ready 的 click trigegr outlsde 您还需要阻止浏览器默认提交表单。

目前您的页面在您提交时可能会刷新...正常的浏览器行为。

在点击处理程序中，您需要通过返回false 或使用preventDefault() 来防止这种情况发生

$(".add_detail_land_down").click(function (event) {

   /* use either of these */

   /* before your ajax code */
    event.preventDefault();

    /* or after your ajax code*/

     return false;

})

Answer 3

statusCode 是数字，对于您的情况应该是 200 将其从 success 更改为 200，如下所示：

statusCode: {
    200: function (data) {
        $("#total_hidden").html(data.total_hidden);
    }
}

Answer 4

你的成功回调应该这样指定（如果你只关心 200）：

success: function (data) {
    $("#total_hidden").html(data.total_hidden);
}

此外，您尝试在元素上执行 click() 的位置实际上可能发生在文档加载之前，因此在 onclick 处理程序准备好之前执行。如果您想在文档就绪时自动触发，这应该在 onclick 之后的文档就绪内。