如何通过jQuery Ajax在HTML和PHP之间来回传输json字符串

How to transfer json strings back and forth between HTML and PHP via jQuery Ajax?

本文关键字:之间 传输 字符串 json PHP jQuery 何通过 Ajax HTML      更新时间:2023-09-26

嗨,我是PHP和jQuery的新手,我正在做一些测试,试图弄清楚事情是如何工作的。但是我一直无法在我的网页和服务器上的 php 文件之间来回传输数据。这是代码:

<center>
  <form>
    <hr>
    <table style="width:80%;border:3px;">
      <tr>
        <td align="center"><input type="text" id="name" placeholder="First Last"></td>
        <td align="center"><input type="text" id="ssn" placeholder="First Last"></td>
        <td align="center"><input type="text" id="birth" placeholder="First Last"></td>
        <td align="center"><input type="text" id="xxxx" placeholder="First Last"></td>
        <td align="center"><button type="button" id="add">Add</button></td>
        <script>
          $("#add").click(function() {
            var nameIn = $('#name').val();
            var ssnIn = $('#ssn').val();
            var birthIn = $('#birth').val();
            var xxxxIn = $('#xxxx').val();
            
            xxxxIn = "'$" + xxxxIn;
            $.ajax({
              type:"POST",
              url:"database_update.php",
              dataType:"JSON",
              data: {
                name: nameIn,
                ssn: ssnIn,
                birth: birthIn,
                xxxx: xxxxIn
                },
              success: function(ret) {
                var out = JSON.stringify(ret);
                alert(out);
                }
            });
          });
        </script>
      </tr>
    </table>
  </form>
</center>
 

<?php
$name = $_POST['name'];
$ssn = $_POST['ssn'];
$birth = $_POST['birth'];
$xxxx = $_POST['xxxx'];
header('Content-type: application/json');
if (isset($name))
{
  $ret = array(
    "name" => $name,
    "ssn" => $ssn,
    "birth" => $birth,
    "xxxx" => $xxxx
    );
  echo json_encode($ret);
} ?>

警报函数从未触发,来自 php 的响应成功。

尽管似乎不太可能有人会偶然发现这篇文章与完全相同的问题,但我会发布一个包含评论本质的答案。

1)从PHP标签"<?php"中删除空格,而不是"<? php"

2)在你的标签中包含jQuery(你已经完成了)

3)确保文件位于同一目录中,或者在AJAX调用中包含目录路径(您在这里也很好)

4) 在 Chrome 控制台或 Firebug 的"网络"选项卡中验证响应。 这里不应该看到任何 PHP。

5)尽可能降低复杂性。 一旦它开始工作,逐渐重新添加代码。