0

私はjqueryを使用するのが初めてです。simplemodal.js (Eirc Martin の単純なモーダル) に、データ (リンク) とオプションを受け取る「jBox」という関数を追加しようとしています。ajax を使用すると、コンテンツがモーダル コンテナーに読み込まれます。このように、ページのいくつかの場所でこの関数を簡単に呼び出したい

    jBox = function(address, options){
        $.get(address, function(data) {     
            $.modal(data);
        }); 
    };
});

コードは正常に動作していますが、コンテンツが完全に読み込まれる前に読み込みイメージを追加したいと考えています。simpleboxのローダー/スピナーに関する同様の投稿がたくさんありますが、私にとってはどれもうまくいきません。次のコードを試していました

$('#test').load('<img src="loader.gif">').html(data);
$('#test').modal();

しかし、どういうわけか、それは私にはうまくいきません。私が間違っていることは何ですか？ありがとう

4

1 に答える 1

0

ajaxStartとイベントを使用しajaxStopます。

$("body").on({
    ajaxStart: function() { 
        $(this).addClass("loading"); // so page knows it's in loading state
        // .. your modal code
    },
    ajaxStop: function() { 
        $(this).removeClass("loading"); // not it loading state anymore
        // .. What you should do if loading is done. (eg. hide modal)
    }    
});

この場合、body クラスを「loading」に設定します。そのため、必要に応じて css でいくつかの魔法を実行できます。フォームを無効にするためにも使用する傾向があります。

body.loading div.some-class {
    // your special style for during loading
}
于 2013-03-29T11:03:24.707 に答える