return ajax.done数据在jquery上出现错误

return ajax.done data gives error on jquery

本文关键字:错误 jquery ajax done 数据 return      更新时间:2023-10-07

我的ajax.done中有数据,它在jquery上出错。我在谷歌上搜索了一下,什么也找不到。

该怎么办?

function select_aragement(arragament){
  var arrst = arragament;
  var arrsplit = arrst.split("|");
  var periode = arrsplit[0];
  var id = arrsplit[1];
  var postsjson;
  var test= $.ajax({ 
    type: 'POST',
    async: true,
    url: 'ajax/prijzen.php',
    data: { id: id, periode: periode },
    dataType: 'json'
  }).done(function (vis) {
    console.log(vis);
    postsjson = $.parseJSON(vis);
  });
  return  postsjson;
}

您不应该试图从回调函数返回任何内容,因为返回的值没有任何意义。相反,您只需在回调函数中使用来自AJAX请求的响应

假设你有这个代码:

function bar() {
var myObject = foo();
// do something with myObject
}
function foo() {
    var bar; // 1
    var xhr = $.ajax({
        url: yourUrl,
        dataType: 'json',
        type: 'post',
        data: {
            some: 'data'
        }
    }); // 2
    xhr.done(function(yourObject) {
        bar = yourObject; // 5
    }); // 3
    return bar; // 4
}
bar();

foo函数内部的注释指示这些语句的执行顺序。因此,您声明一个变量bar,声明一个具有Deferred对象的变量xhr,用回调函数为其附加一个done处理程序,返回bar的值,然后设置了bar的值(太晚了-您已经尝试返回它了)。

在执行bar函数的过程中,myObject将是未定义的,因为在返回语句之前没有设置foo函数中bar的值。您需要做的只是将// do something with myObject代码移动到回调函数,并在那里使用bar

function foo() {
    var xhr = $.ajax({
        url: yourUrl,
        dataType: 'json',
        type: 'post',
        data: {
            some: 'data'
        }
    }); // 1
    xhr.done(function(yourObject) {
        var bar = yourObject; // 4
        // do something with bar
    }); // 2
    // 3 - function execution has finished
}

您可能需要将返回行移动到已完成的部分中

}).done(function (vis) {
     console.log(vis);
     postsjson = $.parseJSON(vis);
     return  postsjson;
});

但请记住,作为一个异步调用,您的返回也是如此。我的建议是通过回拨。

function select_aragement(arragament, callback){
    var arrst = arragament;
    var arrsplit = arrst.split("|");
    var periode = arrsplit[0];
    var id = arrsplit[1];
    var postsjson;
    var test= $.ajax({ 
         type: 'POST',
         async: true,
         url: 'ajax/prijzen.php',
         data: { id: id, periode: periode },
         dataType: 'json'
     });
   test.done(function (vis) {
      console.log(vis);
     postsjson = $.parseJSON(vis);
     callback && callback(postjson);
    });
}

并修改代码以使用回调而不是返回值。

之前

var postjson=select_aragement(arragament);
...stuff with postjson...

之后

 select_aragement(arragament, function(postjson) {
    ...stuff with postjson...
});

您正试图使ajax调用同步启动,为此您需要使async属性为false。

async: false,

问题:

查看以下代码:

function getValue(){
    var value = 0;
    setTimeout(function(){
        value = 42;
    }, 1000);
    return value;
}

返回的值是多少?

小提琴

这与的问题完全相同

 function select_aragement(arragament){
      var postjson;
      $.ajax(...).done(function(vis){ 
         postjson = vis;
      });
      return postjson;
 }

解决方案:

我想你可以通过以下方式使用你的功能:

var data = select_aragement(arragament);
// do something with data :
$.each(data, function(){
    ....
});

你可以这样更改select_aragement的代码:

function select_aragement(arragament){
  var arrst = arragament;
  var arrsplit = arrst.split("|");
  var periode = arrsplit[0];
  var id = arrsplit[1];
  var test = $.ajax({ 
      type: 'POST',
      async: true,
      url: 'ajax/prijzen.php',
      data: { id: id, periode: periode },
     dataType: 'json'
  });
  // return the promise which wraps the ajax call
  return test;
}

调用代码如下:

// "p" stands for "promise"
var p = function select_aragement(arragament);
p.done(function(data){
    // do something with data :
    $.each(data, function(){
        ....
    });
});

或不带局部变量:

select_aragement(arragament).done(function(data){
    // do something with data :
    $.each(data, function(){
        ....
    });
});

在这种情况下,您可以使用来自jQuery的async/await混合to.done,如下所示:

async function myasyncfunction(myArgs){
    
    var response = [];
    var req = $.ajax({
        method: "GET",
        url: resquestURL,
        dataType: "json",
    })
    
    await req.done( res => {
        //DO some stuff with your data
           
        for (let index = 0; index < res.length; index++) {
            const element = res[index];
            response .push( "some stuff" + element );
        }
    })
    
    return response;
}