![](/img/trans.png)
[英]Invoke jQuery ajaxSuccess (or any global AJAX event) even if the local success (or any local AJAX event) throws an error
[英]Global ajaxSuccess event before local success event
我有一个ASP MVC应用程序,该应用程序允许用户使用jQuery ajax调用向div添加多个局部视图。
jQuery("#AddNew").click(function () {
$.ajax({
url: this.href,
cache: false,
success: function (html) {
jQuery("#DivId").append(html);
}
});
return false;
});
问题在于,由于必须授权用户执行返回部分视图的操作,因此当用户会话超时时,它将呈现登录页面而不是部分视图。 我在多个地方都使用类似的ajax调用,因此我将以下内容添加为全局ajaxSuccess事件:
jQuery(document).ajaxSuccess(function (event, request, settings) {
var isLogin = jQuery(request.responseText).find('.login-form').length;
if (isLogin > 0) {
var url = document.URL;
var rootPath = '@Request.Url.GetLeftPart(UriPartial.Authority)';
var path = url.replace(rootPath, '');
var pathEncoded = encodeURIComponent(path);
var loginURL = rootPath + "/Account/Login?returnUrl=" + pathEncoded;
location.href = loginURL;
}
});
这是可行的,因为当发出未经授权的ajax请求时,它将把用户重定向到登录页面。 但是,它仍将html添加到div,在重定向之前的一小段时间内可见。
有没有办法让全局事件在本地事件之前触发? jQuery API显示,本地成功事件在全局ajaxSuccess事件之前触发,因此我尝试将ajax调用更改为使用complete而不是成功。 确实可以,但是似乎由于某些原因,如果我以后需要添加仅在成功后才能执行的代码,那么我也会遇到相同的问题。 有没有更好的方法来解决这个问题?
我可能建议创建包装ajax
方法的自己的API,以确保您需要的功能(特别是操作顺序)。 这是一个过于简化的示例:
var async = function(props) {
var finished = $.Deferred();
$.ajax(props)
.done(function(response) {
// detect auth timeout, handle consisently
if(response.isAuthTimeout) {
// render login ui
finished.reject('auth-timeout');
} else {
finished.resolve.apply(finished, arguments);
}
})
.fail(function() {
finished.reject.apply(finished, arguments);
})
return finished;
};
然后,在实践中,您将调用async
(或任何您决定调用包装器的方法),而不是本机的$.ajax
API。
说得通?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.