使用jQuery通过Ajax提交带有数组结构表单数据的最佳实践

<form id="invite-form" method="post" action="">
    <!-- 第一个朋友 -->
    <input type="text" name="friends[0][first_name]" placeholder="朋友1 姓" />
    <input type="text" name="friends[0][last_name]" placeholder="朋友1 名" />
    <input type="email" name="friends[0][email]" placeholder="朋友1 邮箱" />

    <!-- 第二个朋友 -->
    <input type="text" name="friends[1][first_name]" placeholder="朋友2 姓" />
    <input type="text" name="friends[1][last_name]" placeholder="朋友2 名" />
    <input type="email" name="friends[1][email]" placeholder="朋友2 邮箱" />

    <!-- 更多朋友... -->

    <input type="submit" value="邀请" />
</form>

jQuery("#invite-form").submit(function(e) {
    // 阻止表单的默认提交行为，避免页面刷新
    e.preventDefault();

    // 使用 serialize() 方法获取表单数据，它会生成一个URL编码的字符串
    // 例如："friends%5B0%5D%5Bfirst_name%5D=John&friends%5B0%5D%5Blast_name%5D=Doe&..."
    let formData = jQuery(this).serialize();

    // 可以在这里添加额外的固定数据，例如一个action参数
    // 如果需要额外参数，可以这样拼接：
    // formData += '&action=invite-friends';

    jQuery.ajax({
        type: "POST", // 建议使用POST方法提交表单数据
        url: 'invitation.php', // 服务器端处理脚本的URL
        data: formData, // 直接传递序列化后的字符串
        dataType: 'json', // 期望服务器返回的数据类型，例如JSON
        cache: false, // 禁用浏览器缓存
        encode: true, // 确保数据被正确编码（通常默认为true）
        success: function(response) {
            // 请求成功后的回调函数
            console.log("服务器响应：", response);
            if (response.success === true) {
                // 处理成功逻辑，例如显示成功消息
                alert("邀请成功！");
            } else {
                // 处理失败逻辑
                alert("邀请失败：" + response.message);
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            // 请求失败后的回调函数
            console.error("Ajax请求失败：", textStatus, errorThrown);
            alert("请求发生错误，请稍后再试。");
        }
    });
});

<?php
header('Content-Type: application/json'); // 设置响应头为JSON

$response = ['success' => false, 'message' => '未知错误'];

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // 检查 $_POST 是否包含 'friends' 键
    if (isset($_POST['friends']) && is_array($_POST['friends'])) {
        $friends = $_POST['friends'];

        echo "<h2>接收到的朋友数据：</h2>";
        echo "<pre class="brush:php;toolbar:false">";
        print_r($friends); // 打印整个朋友数组结构
        echo "