如何使用 jQuery 和 PHP 在不刷新页面的情况下提交表单数据？

使用 jQuery 和 PHP 通过 Ajax 提交表单数据 (form.php)

为了防止提交表单时浏览器重定向，您可以利用 jQuery和阿贾克斯。以下是如何针对所提供的表单实现此目的：

<form>

jQuery:

$(document).ready(function () {
    $('#foo').submit(function (event) {
        event.preventDefault();
        var $form = $(this);
        var $inputs = $form.find('input, select, button, textarea');
        var serializedData = $form.serialize();
        $inputs.prop('disabled', true);
        $.ajax({
            url: '/form.php',
            type: 'post',
            data: serializedData,
            done: function (response) {
                console.log('Hooray, it worked!');
            },
            fail: function (jqXHR, textStatus, errorThrown) {
                console.error(
                    'The following error occurred: ' +
                        textStatus,
                    errorThrown
                );
            },
            always: function () {
                $inputs.prop('disabled', false);
            }
        });
    });
});

PHP (form.php):

// Access posted data through $_POST
$bar = isset($_POST['bar']) ? $_POST['bar'] : null;

您还可以使用简写 .post 代替jQuery 中的 .ajax：

$.post('/form.php', serializedData, function (response) {
    console.log('Response: ' + response);
});

提示：

• 清理发布的数据以防止恶意注入。
• 将 jQuery 代码放入$(document).ready() 处理程序。
• 您可以链接回调处理程序（done()、fail()、always()）以获得更多控制。

以上是如何使用 jQuery 和 PHP 在不刷新页面的情况下提交表单数据？的详细内容。更多信息请关注PHP中文网其他相关文章！