Javascript 可以知道在OOP方法中ajax调用何时完成吗

对不起，标题很混乱。我无法用语言更好地描述它

这就是我想知道的。比方说

function myClass()
{
   $.ajax({
      type:'get',
      url:'some/path/',
      success:function(response)
      {
         // call has been compeleted, set some flag here
      }
   });

   return this;
}

var obj = new myClass();
jQuery('body').append('<div id="overlay"></div>'); // so now the user will know he has to wait for some operation to be completed...    

// now determine on this line whether the Ajax call is still in progress
while(<ajax call still in progress>)
{
   // i do not need to do anything here since the overlay is already there in place
}

// now this is where I want to remove the overlay
jQuery('#overlay').remove();

函数myClass（）
{
$.ajax({
类型：'get'，
url:'some/path/'，
成功：功能（响应）
{
//呼叫已完成，请在此设置一些标志
}
});
归还这个；
}
var obj=新的myClass（）；
jQuery（'body'）。追加（“”）；//因此，现在用户将知道他必须等待某些操作完成。。。
//现在在这一行确定Ajax调用是否仍在进行中
while（）
{
//我不需要在这里做任何事情，因为覆盖层已经在那里了
}
//现在，这就是我要删除覆盖的地方
jQuery（'#overlay'）.remove（）；

更新

---

基本上，当ajax调用完成时，我将显示一个加载覆盖，一旦它完成，我将删除该覆盖我知道我可以在类本身内部编写代码，但我希望能够控制在类外部添加/删除覆盖。

您应该使用此类请求的承诺性质。所以，请参考什么

$.ajax

返回所创建对象的属性

然后，您可以对该属性使用

then

方法来了解所有操作何时完成

下面是调用测试服务器的代码，该服务器在请求挂起（1秒）时显示银色覆盖：

函数myClass（路径）{
this.request=$.ajax({
// ^^^^^^^^^^^^
键入：“get”，
url:path，
});
}
var obj=新的myClass（'https://httpstat.us/200?sleep=1000');
jQuery（'body'）。append（''）；
obj.request.then（功能（响应）{
console.log（'done'）；
jQuery（'#overlay'）.remove（）；
});
#覆盖{
位置：绝对位置；
宽度：100%；
身高：100%；
背景：银；
}
您应该使用此类请求的承诺性质。所以，请参考什么
$.ajax
返回所创建对象的属性

然后，您可以对该属性使用
then
方法来了解所有操作何时完成

下面是调用测试服务器的代码，该服务器在请求挂起（1秒）时显示银色覆盖：


函数myClass（路径）{
this.request=$.ajax({
// ^^^^^^^^^^^^
键入：“get”，
url:path，
});
}
var obj=新的myClass（'https://httpstat.us/200?sleep=1000');
jQuery（'body'）。append（''）；
obj.request.then（功能（响应）{
console.log（'done'）；
jQuery（'#overlay'）.remove（）；
});
#覆盖{
位置：绝对位置；
宽度：100%；
身高：100%；
背景：银；
}
我会这样做：

/*构造函数*/
函数myClass（successCallback）{
$.ajax({
背景:这,，
键入：“获取”，
url:“some/path/”，
成功：功能（响应）{
this.inProgress=false；
successCallback.call（this）；
}
});
this.inProgress=true；
}
/*创建新类并向主体添加覆盖*/
var obj=新的myClass（removeOverlay）；
jQuery（'body'）。append（''）；
/*删除覆盖的函数*/
函数removeOverlay（）{
if（！this.inProgress）jQuery（'#overlay'）.remove（）；
}
我会这样做：

/*构造函数*/
函数myClass（successCallback）{
$.ajax({
背景:这,，
键入：“获取”，
url:“some/path/”，
成功：功能（响应）{
this.inProgress=false；
successCallback.call（this）；
}
});
this.inProgress=true；
}
/*创建新类并向主体添加覆盖*/
var obj=新的myClass（removeOverlay）；
jQuery（'body'）。append（''）；
/*删除覆盖的函数*/
函数removeOverlay（）{
if（！this.inProgress）jQuery（'#overlay'）.remove（）；
}
您可以将回调作为参数传递给对象构造函数：

function myClass(onStart, onStop) {
    $.ajax({
        type:'get',
        url:'some/path',
        data: {
            action: 'test'
        },
        beforeSend: function() {
            if (onStart && typeof onStart == 'function') {
                onStart();
            }
        },
        success: function(response) {
            //do something
        },
        complete: function() {
            if (onStop && typeof onStop == 'function') {
                onStop();
            }
        }
    });
}

var onStart = function () {
    console.log('Started');
}
var onStop = function () {
    console.log('Stopped');
}

var obj = new myClass(onStart, onStop);

您可以将回调作为参数传递给对象构造函数：

function myClass(onStart, onStop) {
    $.ajax({
        type:'get',
        url:'some/path',
        data: {
            action: 'test'
        },
        beforeSend: function() {
            if (onStart && typeof onStart == 'function') {
                onStart();
            }
        },
        success: function(response) {
            //do something
        },
        complete: function() {
            if (onStop && typeof onStop == 'function') {
                onStop();
            }
        }
    });
}

var onStart = function () {
    console.log('Started');
}
var onStop = function () {
    console.log('Stopped');
}

var obj = new myClass(onStart, onStop);

@asprin使用
beforeSend
和
complete
事件在请求进行时启动和停止执行某项操作。重要的是要知道在呼叫进行时您到底想做什么。你能说得具体一点吗？你不应该在构造函数中返回任何内容。@asprin使用
beforeSend
和
complete
事件在请求进行时启动和停止执行某些操作。在调用进行时，确切地知道你想要执行的操作非常重要。你能说得具体点吗？你不应该在构造函数中返回任何东西。我已经从类
myClass
中删除了所有不相关的代码。我不能使用
return
进行ajax调用，因为我已经在课程结束时返回了
this
。我已将我的答案更新为您问题的最新版本。谢谢您的回答。很高兴看到一个问题可以通过多种方式解决。我很难只选择一个答案。我已经从类
myClass
中删除了所有不相关的代码。我不能使用
return
进行ajax调用，因为我已经在课程结束时返回了
this
。我已将我的答案更新为您问题的最新版本。谢谢您的回答。很高兴看到一个问题可以通过多种方式解决。我很难只选择一个被接受的答案。谢谢你的回答。很高兴看到一个问题可以通过多种方式解决。我很难只选择一个作为公认的答案。不客气@asprin。我很高兴能帮助你。选择对你帮助最大的一个。不用难过谢谢你的回答。很高兴看到一个问题可以通过多种方式解决。我很难只选择一个作为公认的答案。不客气@asprin。我很高兴能帮助你。选择对你帮助最大的一个。不用难过谢谢你的回答。是的