1

私は jQuery UI Vertical Tabs を使用しており、コンテンツは AJAX 経由で読み込まれます。ここの投稿からほとんどすべてを試しましたが、これまでのところ何も役に立ちませんでした.. :/

に配置したcss3の読み込みアニメーションを表示したい<div id="loading-image">...</div>。これまでのところ、ほとんど何も起こっていません。

私のコード

$(function() {
    $( "#messages_tabs_div" ).tabs({
        beforeLoad: function( event, ui ) {
            console.log(ui);
            ui.jqXHR.error(function() {
                ui.panel.html("Couldn't load your messages. Try refreshing your page."+
                    " If you think this is bug you can help us by submitting it at bugs@go-out-sport.com "  );
            });
            ui.jqXHR.complete(function(response){                
                console.log(response);                    
            });
        },
        disabled: [6],
        select: function(event, ui) {
            alert('ASDAD');
        }
    }).addClass( "ui-tabs-vertical ui-helper-clearfix" );
    $( "#messages_tabs_div li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );
});

//jQuery MINE
$(document).ready(function(){
    $('#loading-image').hide();
    //Set loading bar for all ajax requests
    $('#loading-image').bind('ajaxStart', function(){
        alert('AJAXXX');
        $(this).show();
    }).bind('ajaxStop', function(){
        $(this).hide();
    });    

    $('#loading-image').bind('tabsselect', function(event, ui) {
        alert('TABSSSSS');
        $(this).show();
    }).bind('tabsload', function(event, ui) {
        $(this).hide();
    });
});

私が得る唯一のものはAJAX alert. 削除しよう$('#loading-image').hide();としましたが、読み込みは常にそこにありました。

助けてください ....

前もって感謝します

4

1 に答える 1

2

グローバルな ajax ローディングを使用することをお勧めします。

$(document).ajaxStart(function() {
    $("#loading").fadeIn(200);
}).ajaxStop(function() {
    $("#loading").fadeOut(300);
}).ajaxSuccess(function() {
});

ただし、複数のイベント用にパーソナライズする場合は、次の質問を参照してください。

特定の ajax 呼び出しで .ajaxStart() を呼び出す方法

jQuery は複数の ajaxStart/ajaxStop 処理を使用する必要があります

于 2013-03-06T19:30:43.133 に答える