Question

在我的JS脚本的开头，我想从php文件中分配一些全局变量，我需要在不同的函数中使用整个页面。所以，首先我这样做了：

HTML

<button onclick="somename()"> CALL FUNCTION </button></div>

JS

var a,
    b;

$.ajax({
    type: "POST",
    url: "test.php",
    data: {getvar: "getvar"},
    success: function(data) {
        a = data["a"];
        b = data["b"];
    },
    dataType: "json",
    async: false
}); 

    console.log(a);
$(document).ready(function() {  
    console.log(a);
    console.log(b);
});

function somename() {
    console.log(a);
}

对于上面的方法，我需要使用async：false，但这已经被弃用，并不是很好的解决方案，因为浏览器可以冻结，但它可以根据需要运行。然后，我改变了这种方式：

$.post(
    "test.php",
    {getvar: "getvar"},
    function(data) {
        funget(data);       
    },
    "json"
);  

function funget(param) {
    $(document).ready(function() {  
        console.log(param["a"]);
        console.log(param["b"]);
    });

    function somename() {
        console.log(param["a"]);
    }
}

但是在一个函数中使用整个js脚本似乎也不是一个好的解决方案，至少函数somename（）不起作用可能会有一些其他问题。那么，如何让事情按需运行并保存解决方案呢？

Answer 1

您可以使用ajaxComplete或等待ajax调用完成后再继续。

var a,
b;

$.ajax({
    type: "POST",
    url: "test.php",
    data: {getvar: "getvar"},
    success: function(data) {
        a = data["a"];
        b = data["b"];
    },
    dataType: "json"
}); 

// do "asynchronous" things here

$.ajaxComplete(function() {
   // do stuff now that call is complete
});

另一种方法是使用ajax方法的完整属性。

var a,
b;

$.ajax({
    type: "POST",
    url: "test.php",
    data: {getvar: "getvar"},
    success: function(data) {
        a = data["a"];
        b = data["b"];
    },
    complete: function(data) {
        // do stuff now that call is complete
    },
    dataType: "json"
}); 

// do "asynchronous" things here

Answer 2

// we put a and b in global scope
var a, b;

// we delay ready event
$.holdReady( true );

$.post(
    "test.php",
    {getvar: "getvar"},
    function(data) {
        funget(data);       
    },
    "json"
);  

var funget = function(param) {
    // since defined in global scopes, we will be able to access them from everywhere
    a = param["a"];
    b = param["b"];

    // we release ready event
    $.holdReady( false );
}

https://api.jquery.com/jquery.holdready/

我使用了一些与你的例子相近的东西来更好地理解。但是，对ajax请求的完整回调确实更简单。 holdReady在这种情况下实际上表明了一个糟糕的设计。

jquery ajax获取数据并设置为全局变量

2 个答案: