将gif绑定加载到ajaxSend事件,不起作用

时间:2014-06-23 10:29:48

标签: jquery ajax events bind loading

我试图让我的ajax加载gif工作。 Ajax运行正常。但它似乎没有触发显示微调器显示。

这是我的DIV和我的CSS。我知道这个显示得当,因为我没有使用" display:none"来测试它。

<div id="spinner" class="spinner" style="display:none;"></div>

.spinner {
    background: url('images/spinner.gif') !important;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -16px; /* half width of the spinner gif */
    margin-top: -16px; /* half height of the spinner gif */
    text-align:center;
    z-index:1234;
    overflow: auto;
    width: 32px; /* width of the spinner gif */
    height: 34px; /*hight of the spinner gif +2px to fix IE8 issue */
}

这是我的javascript。注意&#34; bind&#34;到&#34; ajaxSend&#34;。 虽然ajax调用在我的页面上正常工作,但它不会触发微调器显示。它也不会触发警报()。

$(document).ready(function() {

    $("#spinner").bind("ajaxSend", function() {
        alert('triggered'); //This does not seem to trigger
        $(this).show();    // This does not seem to trigger
    }).bind("ajaxStop", function() {
        $(this).hide();
    }).bind("ajaxError", function() {
        $(this).hide();
    });

 $("#confirmbutton").on("click", function(event) {

        event.preventDefault();

        $.post( "/bm/form/save", $( ".form" ).serialize(), function() {

        })
            .done(function(data) {
                //do stuff
                alert( "done" );

            })
            .fail(function() {
                alert( "There was a problem saving!" );
            })
            .always(function() {
                alert( "finished (always)" );
        });


    });

1 个答案:

答案 0 :(得分:1)

试试这个

$( document ).ajaxSend(function() {
  alert("foo");
});