如何通过POST传递JavaScript数组至PHP？解决PHP未接收问题

核心问题拆解 #

你看到页面显示「未接收到数据项」，本质是两个问题：

• 页面首次加载是GET请求，此时没有POST数据，页面上的PHP代码会直接输出这句话；
• AJAX请求是独立发送的，它的响应不会自动替换页面内容，而且数组传递的处理细节没做对。

修复步骤及代码调整 #

1. 修正PHP页面逻辑（区分初始加载和AJAX请求） #

修改testjs.php，让它能识别AJAX的POST请求，并且处理数组输出：

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
    <script src="tagsArray.js"></script>
</head>

<body>
    <!-- 用来显示AJAX响应的容器 -->
    <div id="response-box"></div>

<?php
// 专门处理AJAX的POST请求
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    if (isset($_POST['items'])) {
        $items = $_POST['items'];
        // 数组不能直接用echo输出，转成JSON字符串或者用print_r
        echo "接收到的数据项: " . json_encode($items);
    } else {
        echo "未接收到数据项。";
    }
    // 处理完AJAX请求就终止脚本，避免输出页面其他内容
    exit;
}

// 页面首次加载时显示的内容
echo "页面已加载，等待AJAX请求...";
?>
</body>

2. 优化JavaScript代码（移除无效请求，处理响应） #

删除第一个无意义的AJAX请求，在成功回调里把响应更新到页面：

var arrayItems = ["item1", "item2", "item3"];

$.ajax({
    method: 'post',
    url: 'testjs.php',
    data: { items: arrayItems }, 
    success: function(response) {
        console.log("发送成功");
        // 把AJAX返回的内容显示到页面容器里
        $('#response-box').text(response);
    },
    error: function(xhr, status, error) {
        console.log("AJAX请求错误:", error);
    }
});

可选：用JSON格式传递数据 #

如果想直接传递JSON字符串，也可以这么写：

JavaScript端

$.ajax({
    method: 'post',
    url: 'testjs.php',
    contentType: 'application/json',
    data: JSON.stringify({ items: arrayItems }), 
    success: function(response) {
        console.log("发送成功");
        $('#response-box').text(response);
    }
});

PHP端对应处理

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // 读取原始POST数据并解析为数组
    $data = json_decode(file_get_contents('php://input'), true);
    if (isset($data['items'])) {
        echo "接收到的数据项: " . json_encode($data['items']);
    } else {
        echo "未接收到数据项。";
    }
    exit;
}

内容的提问来源于stack exchange，提问作者Wintah