jquery - 在ajax操作期间如何显示跳动或其他指示器？

我想知道当“远程”功能忙于后端过程时如何显示ajax loader gif。

如果可能的话，请您看看milk example并告诉我它如何适合该代码。只需单击“显示此页面上使用的脚本”即可查看源。

谢谢

最佳答案

假设您已经知道如何AJAX。基本过程是，在操作开始时显示图像，而在从服务器返回结果时结束时将其隐藏。

<!--html-->
<img id='ajaxLoader' src='mahAjaxLoader.gif' />
<!--has display:none via CSS-->

--

//js
function doAjaxStuff() {
    $('#ajaxLoader').toggle(); //toggle visibility; it's now shown

    //other stuff

    $.ajax({
        //normal AJAX stuff
        onComplete : function() {
            $('#ajaxLoader').toggle(); //it's hidden again
            //other oncomplete stuff
    });
}

看到：


http://api.jquery.com/toggle-event/
http://api.jquery.com/jQuery.ajax/


编辑：remote方法像ajax请求一样接受对象文字。因此，将其插入：

remote : {
    beforeSend : function() {
        $('#ajaxLoader').toggle();
    }
    onComplete : function() {
        $('#ajaxLoader').toggle();
    }
}