[英]how to disable a function before ajax call, and enable it on ajax success?
I have a function is outside of ajax function, I want to disable this "enable" click function while ajax is running, and enable it after ajax successfully loads, how do I approach this exactly? 我有一个不在ajax函数之外的函数,我想在ajax运行时禁用此“启用”单击功能,并在ajax成功加载后启用它,我该如何正确处理呢? Any help would be appreciated. 任何帮助,将不胜感激。 Here is my code: 这是我的代码:
$('enable').click(function () {
console.log(123);
$(this).css('display', 'none');
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
;
var enable = true;
$('enable').click(function () {
if(enable) {
enable = false;
console.log(123);
$(this).css('display', 'none');
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
enable = true;
}
});
}
});
You can set enable to false when the ajax is trigger. 您可以在触发ajax时将enable设置为false。
EDIT: 编辑:
somthing like this? 这样的东西?
var enable = true;
$('enable').click(function () {
if(enable) {
console.log(123);
$(this).css('display', 'none');
}
});
function callAjax() {
enable = false;
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
enable = true;
}
});
}
if the ajax is inside the click function, then: 如果ajax在click函数内部,则:
$('enable').click(function () {
console.log(123);
$(this).hide();
var that=this;
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
$(that).show();
}
});
});
else: 其他:
$('enable').bind('click',function () {
console.log(123);
$(this).unbind('click');
});
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
$('enable').bind('click',function () {
console.log(123);
$(this).unbind('click');
});
}
});
Try to use .one
instead of .on
, then attach handler on success
. 尝试使用.one
而不是.on
,然后在success
附加处理程序。
function sendRequest() {
var xhr = $.ajax({
type: "POST",
url: $.vp + "signup/distLookup.ashx" + "?first=" + val_f_name + "&last=" + val_l_name + "&country=" + val_country + "&language=" + $.langID,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
console.log(data);
$('enable').one('click', sendRequest); // We restore it when get success
}
}
$('enable').one('click', sendRequest); // once you clicked your handler would be removed
You can just have a flag that you can raise when you want to disable the click event: 您只可以具有一个标志,可以在要禁用click事件时将其升起:
$('enable').click(function () {
if ($(this).data('disabled')) return;
$(this).data('disabled', true);
$.ajax({ ... }).always(function() { $(this).data('disabled', false); }.bind(this));
});
Use .always()
to make sure it is enabled when the ajax request fails as well. 使用.always()
来确保在ajax请求失败时也将其启用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.