我有一个提供标准扩展点的JavaScript小部件。其中之一是beforereate函数。它应该返回false以防止创建一个项。
我已经使用jQuery在这个函数中添加了一个Ajax调用:
beforecreate: function (node, targetNode, type, to) {
jQuery.get('http://example.com/catalog/create/' + targetNode.id + '?name=' + encode(to.inp[0].value),
function (result) {
if (result.isOk == false)
alert(result.message);
});
}
但是我想阻止小部件创建项目,所以我应该在母函数中返回false,而不是在回调中返回false。是否有一种方法可以使用jQuery或任何其他浏览器内API执行同步AJAX请求?
我使用Carcione给出的答案,并将其修改为使用JSON。
function getUrlJsonSync(url){
var jqxhr = $.ajax({
type: "GET",
url: url,
dataType: 'json',
cache: false,
async: false
});
// 'async' has to be 'false' for this to work
var response = {valid: jqxhr.statusText, data: jqxhr.responseJSON};
return response;
}
function testGetUrlJsonSync()
{
var reply = getUrlJsonSync("myurl");
if (reply.valid == 'OK')
{
console.dir(reply.data);
}
else
{
alert('not valid');
}
}
我添加了“JSON”的数据类型,并将. responsetext更改为responseJSON。
我还使用返回对象的statusText属性检索了状态。注意,这是Ajax响应的状态,而不是JSON是否有效。
后端必须以正确(格式良好)的JSON返回响应,否则返回的对象将是未定义的。
在回答最初的问题时,有两个方面需要考虑。一个是告诉Ajax同步执行(通过设置async: false),另一个是通过调用函数的return语句返回响应,而不是返回回调函数。
我也尝试了POST,它工作。
我把GET改为POST,并添加了数据:postdata
function postUrlJsonSync(url, postdata){
var jqxhr = $.ajax({
type: "POST",
url: url,
data: postdata,
dataType: 'json',
cache: false,
async: false
});
// 'async' has to be 'false' for this to work
var response = {valid: jqxhr.statusText, data: jqxhr.responseJSON};
return response;
}
注意,上面的代码只在async为false的情况下有效。如果设置async: true,返回的对象jqxhr将在AJAX调用返回时无效,只有在异步调用结束后才有效,但此时设置响应变量已经太迟了。
可以通过调用将jQuery的Ajax设置设置为同步模式
jQuery.ajaxSetup({async:false});
然后使用jQuery执行Ajax调用。Get(…);
然后再打开一次
jQuery.ajaxSetup({async:true});
我想它的工作原理与@Adam建议的一样,但它可能对那些想要重新配置jQuery.get()或jQuery.post()到更详细的jQuery.ajax()语法的人有帮助。
这是我的简单实现ASYNC请求与jQuery。我希望这能对大家有所帮助。
var queueUrlsForRemove = [
'http://dev-myurl.com/image/1',
'http://dev-myurl.com/image/2',
'http://dev-myurl.com/image/3',
];
var queueImagesDelete = function(){
deleteImage( queueUrlsForRemove.splice(0,1), function(){
if (queueUrlsForRemove.length > 0) {
queueImagesDelete();
}
});
}
var deleteImage = function(url, callback) {
$.ajax({
url: url,
method: 'DELETE'
}).done(function(response){
typeof(callback) == 'function' ? callback(response) : null;
});
}
queueImagesDelete();
首先,我们应该了解什么时候使用$。当我们使用$。get/$。post时
当我们需要对ajax请求进行低级控制时,例如请求头设置、缓存设置、同步设置等,那么我们应该使用$.ajax。
$ . get /美元。post:当我们不需要对ajax请求进行低级控制时。仅简单地获取/发布数据到服务器。这是一种速记
$.ajax({
url: url,
data: data,
success: success,
dataType: dataType
});
因此,我们不能在$.get/$.post中使用其他特性(同步,缓存等)。
因此,对于ajax请求的低级控制(同步,缓存等),我们应该使用$.ajax
$.ajax({
type: 'GET',
url: url,
data: data,
success: success,
dataType: dataType,
async:false
});