Question

我有一个页面可以在服务器端激发Ajax的验证请求。我需要在所有ajax请求完成加载或完成后执行操作。

为此，我以下列方式在递归函数中使用Ext.Ajax.isLoading（）：

function chechValid(){
    if(Ext.Ajax.isLoading()){
        checkValid();
    }else{
        //Code for Action 1
    }
}//EOF

checkValid();

//Code for Action 2

问题在于，当我这样做时，浏览器会出现以下错误：

Mozill FF - 过多的递归

IE - 堆栈溢出：18134

如果这种递归对浏览器来说很重要，那么当所有Ajax请求都完成加载时如何执行任务？

使用延迟不是我想要的，如果使用延迟，则浏览器开始执行其他代码（如上面共享的“行动代码2”），这不是预期的。

主要目的是浏览器不应该执行任何操作，除非所有Ajax请求都已完成，一旦完成，它应该执行特定操作。

对此有任何建议/帮助吗？

先谢谢。

PS：使用ExtJs 4.0.7

（已更新）有关实际情况的详细信息： -

以下是正在面对的情况的简要说明 - 有一个表单，我需要在各个字段上执行服务器端验证。我这样做是通过在模糊事件上发出ajax请求。根据验证Ajax在模糊时触发的服务器响应，字段被标记为无效，并且不允许表单提交。（避免'更改'事件，因为大量的Ajas请求会导致服务器上的大量开销，并且当收到来自各种此类Ajax请求的响应时，也会导致对字段的波动影响）。

除了一种情况外情况正常 - 当用户修改字段的值而不是从字段中“标签”时，她直接点击保存按钮。但是，在这种情况下，模糊事件会被触发，但“保存”的处理不会等待Ajax验证响应并提交表单。因此，我以某种方式需要检查Ajax请求是否已完成加载和进程保存表单。遗憾的是，requestComplete不能满足此目的。如果尝试使用递归，那么当然，由于资源的高使用率，浏览器会挂起。如果我尝试使用暂停脚本（在此处共享 - Javascript Sleep），则会出现同样的情况。

这个可能的解决方法吗？

TIA

Answer 1

您的方法将导致无限递归。

更好的方法是在Ext.Ajax.requestcomplete中注册一个回调函数，类似这样（未经测试）：

Ext.Ajax.on('requestcomplete', function(conn, response, options) {
   if (!Ext.Ajax.isLoading()) {
      //your action...
   }
}

};

Answer 2

除非我误解了这个问题，否则你不能创建几个全局变量。我知道全局变量很糟糕，但在这种情况下它会为你节省很多麻烦。一个全局将是“formReady”并且最初将其设置为false，另一个将是“ajaxActive”并设置为false。您还可以添加一个onSubmit方法，该方法将验证“formReady”是否为真，如果没有提醒用户正在进行验证（或者您可以再次为表单提交设置超时，并进行第二次验证，检查是否“ajaxActive”是真的）。当进行AJAX调用时，它会将变量“ajaxActive”设置为true，一旦完成将formReady设置为true。如果来自AJAX的响应表明表单是好的，您也可以自动重新提交表单。

Answer 3

Ext.Ajax.request（）在您调用它时返回一个事务对象，它是唯一的，允许您识别和中止特定的Ajax请求。

通过在没有指定事务对象的情况下调用Ext.Ajax.isLoading（），它默认为最后一个请求，这就是你必须在此时递归调用它的原因。

如果是我，我会在你关闭它们时创建这些事务对象的数组，并将每个事务对象作为可选参数传递给Ext.Ajax.isLoading（）函数，以检查特定请求是否具有完了。如果有，则可以从数组中删除该事务对象，并且只在数组为空时才进行保存。

这会解决您的递归问题，因为您总是得到有限数量的请求，而您正在等待。

Answer 4

if (Object.keys(Ext.Ajax.requests).length === 0) console.log("No active requests");

ExtJS 4 - 如何检查所有当前的ajax请求是否已完成然后执行操作？

4 个答案: