jQuery AJAX回调函数不能按预期工作：

我试图从AJAX调用的成功部分获取数据。所以我试图为此写一个回调函数。我有这样的代码：jQuery AJAX回调函数不能按预期工作：

var data2; 
    $(function() { 
    function callback(data) { 
     console.log(data); 
     data2 = JSON.parse(data); 
     console.log(data2); 
    } 

    $("myForm") 
     .submit(function (event) { 
     $.ajax({ 
      type: 'POST', 
      url: "/...", 
      data: "JASON", 
      success: callback 
     }); 
     }); 

    console.log(data2); 

    });

在控制台中我看到这样的顺序： undefined的data和data2内容的内容。

我不明白的是，为什么我第一次得到undefined？我不应该先创造价值data吗？为什么最后一个console.log首先被执行？最重要的是，我从AJAX调用获取数据的方法是正确的吗？我还能做些什么来获取数据？谢谢。

来源

2017-05-04 starrr

你的第一个控制台是'console.log（newdata2）;'后面2给你正确的值 –

@VinodLouis这就是我不明白的......为什么它是第一个？它应该是最后一个。 – starrr

[我如何从异步调用返回响应？]（http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call） – Andreas

AJAX调用是异步的，这意味着在调用完成之后，代码会继续执行之前的下一步调用完成。

所以当AJAX调用已经完成时，达到了console.log(newdata2);，我的猜测是newdata2未定义。

在som时间之后（即使是很短的时间），调用将获得其响应，并调用回调函数。

来源

2017-05-04 11:30:20 Cleared

感谢您的答案，你能告诉我在这种情况下该怎么做？ – starrr

您需要获取数据，并获得数据。那么问题是什么？你想要什么样的行为？ – Cleared

我想'console.log（newdata2）;'不要返回undefined，当我调用它时，应该定义它。 – starrr

本声明：

console.log(newdata2);

是出了Ajax调用的，它后。这意味着它在通话开始后立即执行，但不会在通话结束后执行。

来源

2017-05-04 11:31:27 jackstrapp

这是由于javascript的异步性质。由于ajax调用是异步的，因此首先执行console.log(newdata2);（如上面的答案中的Cleared所述）。在ajax调用（异步）成功的时候，你的回调函数被调用。

来源

2017-05-04 11:33:03

-1

设置正常的请求URL。
设置响应数据类型。

$.ajax({  
    type: 'POST', 
    url: "/request/", 
    dataType: "text", // json etc. 
    success: function (data) { 
     callback(data); 
    }  
});

Manual

来源

2017-05-04 11:36:08

请阅读问题 – DibsyJr

我做了你所说的，没有任何改变。 – starrr

阅读答案）你不需要data2 = JSON.parse（data）; - 您可以设置dataType，也不会将ajax回调的响应发送到您的函数。我试过我的答案，这是工作 –

的JavaScript作为你拥有它是非阻塞。当代码由事件循环运行时，它会注销它所需的任何内容。一旦Ajax请求被完成，data2将获得其新的价值......但那时，你会已经运行了最外面的console.log(data2)

var data2;      // no value gets assigned thus is undefined 
$(function() { 

    function callback(data) { 
     console.log(data);   // I get logged second 
     data2 = JSON.parse(data); 
     console.log(data2);  // I get logged last (now with a value, as I'm the success callback) 
    } 

    var frm = $("myForm"); 
    frm.submit(function (event) { 
     $.ajax({ 
     type: 'post',   // post: meaning we're submitting/sending something 
     url: "/...", 
     dataType: "json",  // not JASON but json, (Java Script Object Notation) 
     data: frm.serialize(), // get data from the form 
     success: callback 
     }); 

    event.preventDefault(); // stop actual form submission. 
    }); 

    console.log(data2);   // I get logged first (no value yet) 

});

Visual demo of this event loop，

看一看在上面，整个过程使用工具可视化，希望能让事情变得更清晰。（打开dev控制台，然后点击运行并看到魔术）

正如@MarcosPrez所提到的，您也有语法错误。 dataType应该是json，除非您实际上要将文字值JASON提交给您要拨打的任何API。

为了清楚起见，您希望在应用程序中接下来运行的代码（应答完成后）应该位于回调中，而不仅仅是在Ajax调用旁边。

来源

2017-05-04 12:04:46

jQuery AJAX回调函数不能按预期工作：

回答

相关问题