我想显示 ajax 加载器图像。在我的 Rails 应用程序中，我在单个页面中有三种不同的形式。所有这些页面都是 ajaxified 并且它们正在执行相同的 Controller 操作。我已经添加了 ajax 加载器图像但是当我按下一个表单，然后图像显示给页面中的所有表单。
我的js文件: $("#loading-password").隐藏(); $("#loading-address").隐藏(); $("#loading").隐藏();
$(document).bind("ajaxSend", function(){
$("#loading").show();
$("#loading-password").hide();
$("#loading-address").hide();
}).bind("ajaxComplete", function(){
$("#loading").fadeOut("slow");
});
$(document).bind("ajaxSend", function(){
$("#loading-password").show();
$("#loading-address").hide();
$("#loading").hide();
}).bind("ajaxComplete", function(){
$("#loading-password").fadeOut("slow");
});
$(document).bind("ajaxSend", function(){
$("#loading-address").show();
$("#loading-password").hide();
$("#loading").hide();
}).bind("ajaxComplete", function(){
$("#loading-address").fadeOut("slow");
});
我有三种不同的 div 用于三种形式。我不知道这里出了什么问题。
请大家帮忙。
最佳答案
使用 ajaxsend，您可以将这些函数绑定(bind)到每个 AJAX 调用，如 in the jQuery documentation 所述:
Whenever an Ajax request is about to be sent, jQuery triggers the ajaxSend event. Any and all handlers that have been registered with the .ajaxSend() method are executed at this time.
基本上，您为每个 ajaxsend 事件绑定(bind)了 3 个函数。
要按照您的想法去做，我建议您执行以下操作:
$(document).bind("ajaxSend", function(){
$("#loading").hide();
$("#loading-password").hide();
$("#loading-address").hide();
if ( settings.data === "first_form_data" ) {
$("#loading").show();
} else if (settings.data === "second_form_data"){
$("#loading-password").show();
} else if( settings.data === "third_form_data"){
$("#loading-address").show();
}
});
$(document).bind("ajaxComplete", function(){
if ( settings.data === "first_form_data" ) {
$("#loading").fadeOut("slow");
} else if (settings.data === "second_form_data"){
$("#loading-password").fadeOut("slow");
} else if( settings.data === "third_form_data"){
$("#loading-address").fadeOut("slow");
}
});
基本上我将单个函数绑定(bind)到事件并检查数据以了解已提交的表单。 ajaxComplete 也是一样。
在 ajaxSend 文档页面中，他们使用 URL 来发现哪个调用正在发送数据，但在你的情况下，只要我理解它就不会工作，因为它们都在点击同一条路线。看看at the settings object了解更多信息以找到正确的表格。
关于javascript - Ajax 加载程序图像不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19972087/