将jvectormap连接到ajax访问的数据库

Question

我有这个问题：

JavaScript声明：

var OCUPARE_CULOARE = 
jQuery.ajax({
            type: 'post',
            url: '/wp-content/themes/seopress/VerifiOcupareHARTA.php',
            dataType: 'json',
            data : {data : codparcela},
            success: function(response) {
            var   OCUPARE_CULOARE1 =  JSON.stringify(response);
            alert (OCUPARE_CULOARE1); 

            }
      });
var ALAAA = JSON.stringify(OCUPARE_CULOARE);
console.log (OCUPARE_CULOARE);
console.log (ALAAA);

PHP文件：

 <?php
 $res9= $_POST['data'];
 global $wpdb;
 $ocupate = $wpdb -> get_results("SELECT Cod FROM Ocupare_Cimitir WHERE Cod 
 LIKE  '$res9%'");
 echo (json_encode($ocupate));?>

主要问题是我想将php（json格式）的响应归因于javascript中的变量。

结果：

1）“ console.log（OCUPARE_CULOARE）”返回：{readyState：1，setRequestHeader：ƒ，getAllResponseHeaders：ƒ，getResponseHeader：ƒ，overrideMimeType：ƒ，…}

2）“ console.log（ALAAA）”； 返回：{“ readyState”：1}

3）“ alert（OCUPARE_CULOARE1）;”会返回我想在javascript中放入变量的确切信息：[{“ Cod”：“ F01R01L02”}，{“ Cod”：“ F01R01L10”}，{“ Cod”：“ F01R01L12“}，{” Cod“：” F01R01L13“}，{” Cod“：” F01R01L15“}，{” Cod“：” F01R02L12“}，{” Cod“：” F01R10L10“}]]

抱歉，如果问题太容易了，但对我来说不是。

在过去的两天里，我读过有关ajax异步调用的信息，我确实无法使它正常工作。

Answer 1

问题在于ajax调用是异步的。 这意味着即使ajax调用尚未完成，执行仍将继续执行代码。

解决方案1（回叫）

回调用于告知异步操作，异步操作完成后应执行什么操作。

function getDataFromServer(callback) {
    jQuery.ajax({
        type: 'post',
        url: '/wp-content/themes/seopress/VerifiOcupareHARTA.php',
        dataType: 'json',
        data : {data : codparcela},
        success: function (response) {
            callback(JSON.stringify(response))
        }
    });
}

getDataFromServer(function (OCUPARE_CULOARE1) {
    alert(OCUPARE_CULOARE1);
});

解决方案2（承诺）

尽管Promise的解决方案似乎更冗长，但后来却有所回报，因为它使合并异步函数变得容易。

function getDataFromServer() {
    return new Promise(function (resolve, reject) {
        jQuery.ajax({
            type: 'post',
            url: '/wp-content/themes/seopress/VerifiOcupareHARTA.php',
            dataType: 'json',
            data : {data : codparcela},
            success: function (response) {
                resolve(JSON.stringify(response));
            }
        });
    });
}

getDataFromServer().then(function (OCUPARE_CULOARE1) {
    alert(OCUPARE_CULOARE1);
});

解决方案3（异步/等待）

如果您不需要支持多种浏览器（特别是旧的浏览器），则可以选择异步/等待。 它看起来更干净，并且可以与Promise s互操作。 请注意，只能在async函数内使用await，这就是为什么在我的示例中我添加了doSomething函数。

async function getDataFromServer() {
    return new Promise(function (resolve, reject) {
        jQuery.ajax({
            type: 'post',
            url: '/wp-content/themes/seopress/VerifiOcupareHARTA.php',
            dataType: 'json',
            data : {data : codparcela},
            success: function (response) {
                resolve(JSON.stringify(response));
            }
        });
    });
}

async function doSomething() {
    const OCUPARE_CULOARE1 = await getDataFromServer();
    alert(OCUPARE_CULOARE1);
}

doSomething();

Answer 2

最好将ajax进程放入javascript函数中，并在成功时返回结果，或者如果ajax进程不起作用，则返回false。 谢谢您，如果没有问题，您将得到php文件的结果，如果ajax无法正常工作，则可以输入错误。