[英]Disable all click/keyup events until ajax call has completed
How would you disable all links from being able to be triggered until an ajax call has finished? 在ajax调用完成之前,如何禁用所有链接才能被触发?
I need this to happen on both .(click)
events and .on('keyup')
triggers. 我需要在.(click)
事件和.on('keyup')
触发器上都发生这种情况。
So pretty much what I want is; 我几乎想要的是:
– Ajax link is triggered (by either a click or keyup) – Ajax链接被触发(通过单击或键入)
– Ajax call runs (and whilst is running – all links are disabled) – Ajax调用运行(并且正在运行–禁用所有链接)
– Ajax call finishes and links are reenabled. – Ajax调用完成,并且链接重新启用。
You can add spinner and show the spinner in foreground until yours ajax request is successful. 您可以添加微调器并在前台显示微调器,直到您的Ajax请求成功为止。 Here is a sample code. 这是示例代码。 Here is an example. 这是一个例子。
function OnAjaxStart(ajaxContext) {
$("#spinner").show();
$("a").unbind("click");
$("a").unbind("keyup");
}
function OnAjaxComplete(ajaxContext) {
$("#spinner").hide();
}
function DisplayDataById(actionUrl, data) {
OnAjaxStart();
var request = $.ajax({
url: actionUrl,
data: { data: data},
cache: false
});
request.done(function (data) {
$('#' + divName).empty().html(data);
OnAjaxComplete();
});
}
Here is the spinner HTML: 这是微调器HTML:
<div id="spinner" style="margin: 0px; padding: 0px; position: fixed; right: 0px;
top: 0px; width: 100%; height: 100%; background-color: #666666; z-index: 30001;
opacity: .8; filter: alpha(opacity=70); display: none">
<p style="position: absolute; top: 30%; left: 45%; color: White;">
Please wait ...<img src="@Url.Content("~=""/images/loading-image.gif")" alt="Loading">
</p>
</div>
/* CSS */
#overlay {
position: fixed;
height: 100%;
width: 100%;
z-index: 1000000;
}
On ajax call use this 在ajax电话上使用此
overlay = $("<div id='overlay'></div>").prependTo('body');
$(document).on("keydown",function(objEvent) {
if (objEvent.keyCode == 9) { //tab pressed
objEvent.preventDefault(); // stops its action
}
});
On finish of ajax call use this 在ajax调用完成时使用此
overlay.remove();
$(document).off("keydown");
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.