jquery处理ajax对象外部 AJAX 响应

mec1mxoz  于 2023-04-20  发布在  jQuery
关注(0)|答案(6)|浏览(170)

我正在使用jQuery,我需要处理在AJAX对象外部的 AJAX 调用期间收集的数据:

function getData(yt_url) {
    $.ajax({
        type: "GET",
        url: yt_url,
        dataType: "jsonp",
        success: function(response) {
            //   Return response here //

        },
        error: function(request, status, error) {
            alert(status);
        }
    });
}

我想调用函数getData并在 AJAX 成功函数中接收响应对象。
我尝试添加一些返回值,然后我当然意识到它是一个对象。

wmtdaxz3

wmtdaxz31#

AJAX 是异步的,这基本上意味着它不会阻止脚本的执行(这很好,因为您的网站在加载时不会冻结)。
return像你这样输入一个值是同步的,这与 AJAX 不兼容。
一种解决方案是向getData传递一个回调函数,该函数在 AJAX 请求完成时被调用:

function getData(yt_url, callback) {
    $.ajax({
        type: "GET",
        url: yt_url,
        dataType: "jsonp",
        success: callback,
        error: function(request, status, error) {
            alert(status);
        }
    });
}​

然后你可以像这样使用它:

getData('http://www.example.com/', function(response) {
    alert('The response was: ' + response);
});
fkvaft9z

fkvaft9z2#

您可以尝试这样做添加一个全局变量来存储 AJAX 调用的结果,例如:

var ajaxResult = null;

AJAX 的 async 属性为false,然后写如下:

var ajaxResult = null;

function getData(yt_url){
$.ajax
        ({
            type: "GET",
                        url: yt_url,
                        dataType:"jsonp",
                        async: false,
                        success: function(response){
                            ajaxResult = response; 

                        },error:function (request, status, error)           
});

}
getData(yt_url);//调用函数来尝试获取结果if(ajaxResult!= null){ //如果我们在ajax调用期间得到了一些结果

// do something with the result

}

wxclj1h5

wxclj1h53#

因为 AJAX 是异步的,所以你应该重新构造你的代码来接收回调函数中的数据。每当请求完成时,你就可以继续你想对数据做的任何事情。一个例子:

$.ajax {
    type: "GET",
    url: url,
    dataType:"jsonp",
    success: success,
    error: error
};

function success(data) {
    // continue your work here.
}

function error(request, status, error) {
    // handle any errors here.
}

我不推荐使用async: false,因为它会冻结浏览器,直到它完成执行您的请求,而通常您可能希望它在处理代码时保持响应。

ht4b089n

ht4b089n4#

我不知道这是否适合你们中的任何人,但我在我的情况下所做的是,我将响应数据存储在浏览器的“localSotrage”中,然后在其他常用的javascript函数中使用“localSotrage”数据!!如果它满足您的目的,给予尝试一下!!
也让我知道,如果这种做法有一些负面影响!!

g6ll5ycj

g6ll5ycj5#

jquery AJAX 默认是async,使用async:false禁用它。

function getData(yt_url){
        var data;
        $.ajax
        ({
            type: "GET",
                        async: false,
                        url: yt_url,
                        dataType:"jsonp",success: function(response){
                            //   Return response here //
                            // init data variable
                        },error:function (request, status, error) {alert(status);}
                    });
         return data;
   }
ycggw6v2

ycggw6v26#

你也可以让get-函数异步运行,并使用await来等待响应:

async function getData(yt_url, callback) {
    return await $.ajax({
        type: "GET",
        url: yt_url,
        dataType: "jsonp",
        success: callback,
        error: function(request, status, error) {
            alert(status);
        }
    });
}​

getData().then(response => console.log(response)); // `getData` will return a promise

// But you can use await for `getData()` in another `async function`:
async function useData() {
    const data = await getData();
    console.log(data);
}

相关问题