jQuery Ajax表单提交：处理数组型输入字段的最佳实践

<form id="invite-form" method="post" action="">
    <input type="text" name="friends[0][first_name]" placeholder="Friend 1 First Name" />
    <input type="text" name="friends[0][last_name]" placeholder="Friend 1 Last Name" />
    <input type="text" name="friends[0][email]" placeholder="Friend 1 Email" />

    <input type="text" name="friends[1][first_name]" placeholder="Friend 2 First Name" />
    <input type="text" name="friends[1][last_name]" placeholder="Friend 2 Last Name" />
    <input type="text" name="friends[1][email]" placeholder="Friend 2 Email" />

    <input type="text" name="friends[2][first_name]" placeholder="Friend 3 First Name" />
    <input type="text" name="friends[2][last_name]" placeholder="Friend 3 Last Name" />
    <input type="text" name="friends[2][email]" placeholder="Friend 3 Email" />

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

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

    // 使用 serialize() 方法获取表单数据，它会自动处理数组型字段
    let formData = jQuery(this).serialize();

    // 如果需要，可以添加额外的参数，例如 'action'
    // formData += '&action=invite-friends'; 

    // 发送 Ajax 请求
    jQuery.ajax({
        type: "POST", // 推荐使用 POST 方法提交表单数据
        url: 'invitation.php', // 服务器处理脚本的URL
        data: formData, // 序列化后的表单数据
        cache: false, // 禁用缓存，尤其对于 POST 请求
        dataType: 'json', // 期望服务器返回的数据类型
        success: function(response) {
            // 请求成功后的回调函数
            console.log("服务器响应：", response);
            if (response && 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') {
    // 验证并处理接收到的数据
    if (isset($_POST['friends']) && is_array($_POST['friends'])) {
        $friends = $_POST['friends'];

        // 遍历朋友列表并处理
        foreach ($friends as $index => $friend) {
            $firstName = $friend['first_name'] ?? '';
            $lastName = $friend['last_name'] ?? '';
            $email = $friend['email'] ?? '';

            // 在这里执行业务逻辑，例如保存到数据库、发送邮件等
            // echo "处理朋友 " . ($index + 1) . ": " . $firstName . " " . $lastName . " (" . $email . ")\n";
        }

        $response['success'] = true;
        $response['message'] = '朋友列表已成功接收并处理。';
    } else {
        $response['message'] = '未接收到有效的邀请朋友数据。';
    }
} else {
    $response['message'] = '只接受 POST 请求。';
}

echo json_encode($response);
?>