在原型中,我可以使用以下代码显示正在加载..."图像:
In Prototype I can show a "loading..." image with this code:
var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars, onLoading: showLoad, onComplete: showResponse} ); function showLoad () { ... }在 jQuery 中,我可以将服务器页面加载到元素中:
In jQuery, I can load a server page into an element with this:
$('#message').load('index.php?pg=ajaxFlashcard');但是如何像在 Prototype 中那样将加载微调器附加到此命令?
but how do I attach a loading spinner to this command as I did in Prototype?
推荐答案有几种方法.我的首选方法是将函数附加到元素本身的 ajaxStart/Stop 事件.
There are a couple of ways. My preferred way is to attach a function to the ajaxStart/Stop events on the element itself.
$('#loadingDiv') .hide() // Hide it initially .ajaxStart(function() { $(this).show(); }) .ajaxStop(function() { $(this).hide(); }) ;每当您执行任何 Ajax 调用时,ajaxStart/Stop 函数都会触发.
The ajaxStart/Stop functions will fire whenever you do any Ajax calls.
更新:从 jQuery 1.8 开始,文档指出 .ajaxStart/Stop 应该只附加到 document.这会将上述代码段转换为:
Update: As of jQuery 1.8, the documentation states that .ajaxStart/Stop should only be attached to document. This would transform the above snippet to:
var $loading = $('#loadingDiv').hide(); $(document) .ajaxStart(function () { $loading.show(); }) .ajaxStop(function () { $loading.hide(); });更多推荐
如何在 jQuery 中显示加载微调器?
发布评论