如何使用 AJAX 在 $.load 中正确发布表单数据？-js教程-PHP中文网

如何使用 AJAX 在 $.load 中正确发布表单数据？

Mary-Kate Olsen

发布： 2024-11-11 14:04:03

原创

469 人浏览过

How to Correctly Post Form Data Within $.load Using AJAX?

使用 AJAX 更正 $.load 中的表单发布

当尝试在 $.load 调用中从表单发布数据时，您可能会遇到帖子无法正确发送到目标 PHP 脚本的问题。这可能会导致页面重新加载，而不是处理提交的数据。

要解决此问题，请考虑实施 AJAX。 AJAX 允许您将数据发送到服务器端 PHP 文件，而无需重新加载页面。它的工作原理如下：

文件 #1:

此文件包含表单的 HTML 和 JavaScript 代码。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('#Sel').change(function() {
                    var opt = $(this).val();
                    var someelse = 'Hello';
                    var more_stuff = 'Goodbye';
                    $.ajax({
                        type: "POST",
                        url: "receiving_file.php",
                        data: 'selected_opt=' + opt + '&amp;something_else=' +someelse+'&amp;more_stuff='+more_stuff,
                        success:function(data){
                            alert('This was sent back: ' + data);
                        }
                    });
                });
            });
        </script>
    </head>
<body>

<select id = "Sel">
    <option value ="Song1">default value</option>
    <option value ="Song2">Break on through</option>
    <option value ="Song3">Time</option>
    <option value ="Song4">Money</option>
    <option value="Song5">Saucerful of Secrets</option>
</select>
</body>
</html>

登录后复制

文件#2：receive_file.php

此文件是 PHP 脚本将处理提交的数据。

    $recd = $_POST['selected_opt'];
    echo 'You chose: ' . $recd;

登录后复制

此方法可确保在不重新加载页面的情况下发布表单数据，从而允许您处理数据并做出适当的响应。

以上是如何使用 AJAX 在 $.load 中正确发布表单数据？的详细内容。更多信息请关注PHP中文网其他相关文章！