jQuery:ajax调⽤成功后返回数据
本⽂翻译⾃:
This question already has answers here : 这个问题已经在这⾥有了答案
This question already has answers here
:
这个问题已经在这⾥有了答案 :
(36 answers) (36个答案)
Closed 6 years ago . 6年前关闭。
关闭。
I have something like this, where it is a simple call to a script that gives me back a value, a string.. 我有类似这样的内容,它是
我有类似这样的内容,它是对脚本的简单调⽤,该脚本给了我⼀个值,⼀个字符串。
function testAjax() {
$.ajax({
url: "getvalue.php",
success: function(data) {
return data;
}
});
}
but if I call something like this 但是如果我这样称呼
但是如果我这样称呼
var output = testAjax(svar); // output will
so how can I return the value? 那么我该如何返回值?
下⾯的代码似乎也不起作
那么我该如何返回值? the below code does not seem to 下⾯的代码似乎也不起作⽤...
function testAjax() {
$.ajax({
url: "getvalue.php",
success: function(data) {
}
});
return data;
}
#1楼
参考:
#2楼
Idk if you guys solved it but I recommend another way to do it, and it works :) Idk,如果你们解决了,但我建议您采⽤另⼀种⽅
Idk,如果你们解决了,但我建议您采⽤另⼀种⽅法来解决,它是可⾏的:)
ServiceUtil = d({
base_url : 'someurl',
sendRequest: function(request)
{
var url = this.base_url + request;
var requestVar = new XMLHttpRequest();
dataGet = false;
$.ajax({
url: url,
async: false,
type: "get",
success: function(data){
ServiceUtil.objDataReturned = data;
}
});
return ServiceUtil.objDataReturned;
}
})
So the main idea here is that, by adding async: false, then you make everything waits until the data is retrieved. 因此,这⾥的
因此,这⾥的主要思想是,通过添加async:false,然后让所有内容等待,直到检索到数据为⽌。 Then you assign it to a static variable of
主要思想是,通过添加async:false,然后让所有内容等待,直到检索到数据为⽌。
the class, and everything magically works :) 然后将其分配给该类的静态变量,然后⼀切都会神奇地起作⽤:
然后将其分配给该类的静态变量,然后⼀切都会神奇地起作⽤:
#3楼
See jquery docs example: (about 2/3 the page) 请参阅jquery⽂档⽰例:
(约2/3的页⾯)
请参阅jquery⽂档⽰例: : : (约2/3的页⾯)
You may be looking for following code: 您可能正在寻以下代码:
您可能正在寻以下代码:
$.ajax({
url: 'ajax/test.html',
success: function(data) {
$('.result').html(data);
alert('Load was performed.');
}
});
lower down. 同⼀页...降低。
同⼀页...降低。
#4楼
The only way to return the data from the function would be to make a synchronous call instead of an asynchronous call, but that would freeze up the browser while it's waiting for the response. 从函数返回数据的唯⼀⽅法是进⾏同步调⽤⽽不是异步调
从函数返回数据的唯⼀⽅法是进⾏同步调⽤⽽不是异步调⽤,但这将使浏览器在等待响应时冻结。
You can pass in a callback function that handles the result: 您可以传⼊⼀个处理结果的回调函数:
您可以传⼊⼀个处理结果的回调函数:
function testAjax(handleData) {
$.ajax({
url:"getvalue.php",
success:function(data) {
handleData(data);
}
});
}
Call it like this: 这样称呼它:
这样称呼它:
testAjax(function(output){
// here you use the output
});
// Note: the call won't wait for the result,
// so it will continue with the code here while waiting.
#5楼
Note: This answer was written in February 2010.注意:此答案写于2010年2⽉。
See updates from 2015, 2016 and 2017 at the bottom.请参阅底部的2015、2016和2017年更新。
You can't return anything from a function that is asynchronous. 您不能从异步函数返回任何内容。
您不能从异步函数返回任何内容。 What you can return is a promise . 您可以返回的是⼀个
我在回答以您可以返回的是⼀个承诺 。
。 I explained how promises work in jQuery in my answers to those questions: 我在回答以下问题时解释了Promise如何在jQuery中⼯作:
If you could explain why do you want to return the data and what do you want to do with it later, then I might be able to give you a more specific answer how to do it. 如果您可以解释为什么要返回数据以及以后要使⽤什么数据,那么我也许可以为您提供
如果您可以解释为什么要返回数据以及以后要使⽤什么数据,那么我也许可以为您提供具体的答案。
Generally, instead of: 通常,代替:
通常,代替:
function testAjax() {
$.ajax({
url: "getvalue.php",
success: function(data) {
return data;
}
});
}
you can write your testAjax function like this: 您可以这样编写testAjax函数:
您可以这样编写testAjax函数:
function testAjax() {
return $.ajax({
url: "getvalue.php"
});
}
Then you can get your promise like this: 然后,您可以像这样实现您的承诺:
然后,您可以像这样实现您的承诺:
write的返回值var promise = testAjax();
You can store your promise, you can pass it around, you can use it as an argument in function calls and you can return it from functions, but when you finally want to use your data that is returned by the AJAX call, you have to do it like this: 您可
您可以存储您的诺⾔,可以将其传递,可以将其⽤作函数调⽤中的参数,也可以从函数中返回它,但是当您最终想要使⽤ AJAX调⽤返回的数据时,您必须像这样做:
promise.success(function (data) {
alert(data);
});
(See updates below for simplified syntax.)(有关简化语法,请参见下⾯的更新。)
If your data is available at this point then this function will be invoked immediately. 如果此时您的数据可⽤,则将⽴即调⽤此函
如果此时您的数据可⽤,则将⽴即调⽤此函
如果不是,那么它将在数据可⽤时⽴即调⽤。
数。 If it isn't then it will be invoked as soon as the data is available. 如果不是,那么它将在数据可⽤时⽴即调⽤。
数。
The whole point of doing all of this is that your data is not available immediately after the call to $.ajax because it is asynchronous. 这样做的全部⽬的是,在调⽤$ .ajax之后,您的数据不⽴即可⽤,因为它是异步的。
这样做的全部⽬的是,在调⽤$ .ajax之后,您的数据不⽴即可⽤,因为它是异步的。 Promises is a nice abstraction for functions to say: I can't return you the data because I don't have it yet and I don't want to block and make you wait so here's a promise instead and you'll be able to use it later, or to just give it to someone else and be done with it. Promises是⼀个很好的函数抽象:我⽆法返回数据,因为我还没有数据,并且我不想阻塞并让您等待,所以这是⼀个诺⾔ ,您将能够以后使⽤它,或仅将其提供给其他⼈并完成它。
See this . 看到这个 。
看到这个 。
UPDATE (2015)更新(2015)
Currently (as of March, 2015) jQuery Promises are not compatible with the which means that they m
ay not cooperate very well with other . 当前(截⾄2015年3⽉),jQuery Promises与不兼容,这意味着它们可能⽆法与其他与很好地协作。
当前(截⾄2015年3⽉),jQuery Promises与不兼容,这意味着它们可能⽆法与其他与很好地协作。
However jQuery Promises in the upcoming version 3.x will be compatible with the Promises/A+ specification (thanks to for pointing it out). 但是,即将发布的3.x版本中的jQuery Promises 将与Promises / A +规范兼容(感谢指出了这⼀点)。
但是,即将发布的3.x版本中的jQuery Promises 将与Promises / A +规范兼容(感谢指出了这⼀点)。Currently (as of May, 2015) the stable versions of jQuery are 1.x 当前(截⾄2015年5⽉),jQuery的稳定版本为
当前(截⾄2015年5⽉),jQuery的稳定版本为1.x和2.x。
What I explained above (in March, 2011) is a way to use to do something asynchronously that in synchronous code would be achieved by returning a value. 我上⾯(2011年3⽉)所解释的是⼀种使⽤异步执⾏某项操作的⽅法,该⽅法在同步代码中将
我上⾯(2011年3⽉)所解释的是⼀种使⽤异步执⾏某项操作的⽅法,该⽅法在同步代码中将通过返
回⼀个值来实现。
But a synchronous function call can do two things - it can either return a value (if it can) or throw an exception (if it can't return a value). 但是同步函数调⽤可以做两件事-它可以返回值(如果可以)或引发异常(如果它不能返回值)。
但是同步函数调⽤可以做两件事-它可以返回值(如果可以)或引发异常(如果它不能返回值)。 Promises/A+ addresses both of those use cases in a way that is pretty much as powerful as exception handling in synchronous code. Promises / A +以与同步代码中异常处理⼀样强⼤的⽅式解决了这两种⽤例。 The jQuery version handles the equivalent of Promises / A +以与同步代码中异常处理⼀样强⼤的⽅式解决了这两种⽤例。
returning a value just fine but the equivalent of complex exception handling is somewhat problematic. jQuery版本可以处理
jQuery版本可以处理返回值的问题,但是复杂异常处理的问题有些⿇烦。
In particular, the whole point of exception handling in synchronous code is not just giving up with a nice message, but trying to fix the problem and continue the execution, or possibly rethrowing the sa
me or a different exception for some other parts of the program to handle. 特别是,同步代码中异常处理的全部要点不仅仅是放弃⼀个好消息,⽽是试图解决问题并继续执
特别是,同步代码中异常处理的全部要点不仅仅是放弃⼀个好消息,⽽是试图解决问题并继续执⾏,或者可能将相同或不同的异常抛出给程序的其他部分以处理。 In synchronous code you have a call stack. 在同步代码中,您
在同步代码中,您⾏,或者可能将相同或不同的异常抛出给程序的其他部分以处理。
有⼀个调⽤堆栈。 In asynchronous call you don't and advanced exception handling inside of your promises as required by
有⼀个调⽤堆栈。
the Promises/A+ specification can really help you write code that will handle errors and exceptions in a meaningful way even for complex use cases. 在异步调⽤中,您不会这样做,并且Promises / A +规范要求的Promise中的⾼级异常处理确实可在异步调⽤中,您不会这样做,并且Promises / A +规范要求的Promise中的⾼级异常处理确实可以帮助您编写代码,即使对于复杂的⽤例,也可以以有意义的⽅式处理错误和异常。
For differences between jQuery and other implementations, and how to convert jQuery promises to Promises/A+ compliant, see by Kris Kowal et al. 有关jQuery与其他实现之间的差异以及如何将jQuery Promise转换为Promises / A +兼容的⽅法,请有关jQuery与其他实现之间的差异以及如何将jQuery Promise转换为Promises / A +兼容的⽅法,请参阅Kris Kowal等⼈的的书》。 on the Q library wiki and by Jake Archibald on HTML5 Rocks. 在Q库Wiki上, 由Jake
在Q库Wiki上, 由Jake
参阅Kris Kowal等⼈的的书》。
Archibald在HTML5 Rocks上使⽤ 。
How to return a real promise如何兑现真实的承诺
The function from my example above: 我上⾯的⽰例中的函数:
我上⾯的⽰例中的函数:
function testAjax() {
return $.ajax({
url: "getvalue.php"
});
}
returns a jqXHR object, which is a jQuery . 返回jqXHR对象,它是jQuery
。
返回jqXHR对象,它是jQuery 。
To make it return a real promise, you can change it to - using : 为了使它返回真实的承诺,您可以使⽤将其更改为-:
为了使它返回真实的承诺,您可以使⽤将其更改为-:
function testAjax() {
return Q($.ajax({
url: "getvalue.php"
}));
}
or, using : 或者,使⽤ :
或者,使⽤ :
function testAjax() {
solve($.ajax({
url: "getvalue.php"
}));
}
solve($.ajax(...)) is also what is and it should work with . 这这solve($.ajax(...))也是什么 ,它应该与⼯作
To use the ES6 Promises today you can use by Jake Archibald. 要今天使⽤ES6 Promises,可以使⽤Jake Archibald
要今天使⽤ES6 Promises,可以使⽤Jake Archibald 。
。
To see where you can use the ES6 Promises without the polyfill, see: . 要查看没有polyfill的ES6 Promises可以在哪⾥使⽤,
要查看没有polyfill的ES6 Promises可以在哪⾥使⽤,请参阅:
。
请参阅: 。
For more info see: 有关更多信息,请参见:
有关更多信息,请参见:
Future of jQuery jQuery的未来
Future versions of jQuery (starting from 3.x - current stable versions as of May 2015 are 1.x and 2.x) will be compatible with the (thanks to for pointing it out in the comments). jQuery的未来版本(从3.x开始-截⾄2015年5⽉的当前稳定版本为1.x
jQuery的未来版本(从3.x开始-截⾄2015年5⽉的当前稳定版本为1.x 和2.x)将与兼容(感谢在评论中指出了这⼀点)。 "Two changes that we've already decided upon are Promise/A+
和2.x)将与兼容(感谢在评论中指出了这⼀点)。
compatibility for our Deferred implementation [...]" ( ).“我们已经确定的两个更改是对我们的Deferred实现的Promise / A
+兼容性[...] (
有关更多信息,请参见:Dave Methvin撰写的和 ( )。
)。 For more info see: by Dave Methvin and by Paul Krill. 有关更多信息,请参见:Dave Methvin撰写的和Paul Krill撰写的 。
Interesting talks有趣的演讲
by Domenic Denicola (JSConfUS 2013) 出⾃Domenic Denicola(JSConfUS 2013)
出⾃Domenic Denicola(JSConfUS 2013)
by Michael Jackson and Domenic Denicola (HTML5DevConf 2013) 迈克尔·杰克逊(Michael Jackson)和多⽶尼克·丹
迈克尔·杰克逊(Michael Jackson)和多⽶尼克·丹尼科拉(Domenic Denicola)
(HTML5DevConf 2013)
尼科拉(Domenic Denicola) (HTML5DevConf 2013)
by David M. Lee (Nodevember 2014) David M.Lee的 (2014年11⽉)
David M.Lee的 (2014年11⽉)
UPDATE (2016)更新(2016)
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论