javascript - 为什么我的 ajax post 功能不能与按钮单击一起使用？

Question

当使用 AJAX 单击按钮时，我尝试将变量发布到我的 PHP 文件，但是当我检查 PHP 页面加载时，我没有收到变量.

$(document).ready(function(){
    $("#qryBtn").click(function(){
        // post qry //
        var qry = query();
        $.ajax({
            type: "POST",
            url: "favourites.php",
            data: {
                qry: qry
            },
            success: function (html) {
                console.log (qry);
            }
        });
    });
});

其中 query() 只是一个创建数组的函数。

error_reporting ( E_ALL );
ini_set ( 'display_errors', 1 );
$query = "";
$key = "";
function getQueries() {
    if (isset ( $_POST ['qry'] )) {
        $query = $_POST ['qry'];
        echo $query;
    } else {
        echo "Query Missing";
    }
}
getQueries ();
function saveQueries() {
    if (isset ( $_POST ['keyValue'] )) {
        $key = $_POST ['keyValue'];
        $arr = array_combine ( $key, $query );
    } else {
        echo "Key Missing";
    }
}
saveQueries ();

输出:

Query MissingKey Missing

我使用了类似的过程将数据发布到 PHP 页面，但没有使用按钮单击，我是否缺少某些内容？

Answer 1

可能是因为您没有声明内容类型。

按如下方式更改脚本。

$(document).ready(function(){
    $("#qryBtn").click(function(){
        // post qry //
        var qry = query();
        $.ajax({
            type: "POST",
            url: "favourites.php",
            data: {
                qry: qry
            },
            contentType: 'application/json',
            success: function (html) {
                console.log (qry);
            }
        });
    });
});

默认的jquery ajax内容类型是application/x-www-form-urlencoded； charset=UTF-8 当您以 json 格式发布数据时，您必须通过声明内容类型明确告诉 ajax 您正在发送 json 内容作为application/json

编辑

然后将数据作为字符串内容发送。尝试以下脚本。 (请注意，我已删除 contentType 选项。

$(document).ready(function(){
        $("#qryBtn").click(function(){
            // post qry //
            var _data= JSON.stringify({qry:query()}); 
            $.ajax({
                type: "POST",
                url: "favourites.php",
                data: _data,
                success: function (html) {
                    console.log (qry);
                }
            });
        });
    });