0

フォーム/サーバーのリロードが完了するまで、読み込みメッセージまたはスピナー メッセージを追加したい フォームの読み込みが終了したことを確認してスピナーを無効にする方法を教えてください。

注: フォームが送信されると、サーバーが再起動されるまで更新されたデータは利用できません。再起動と変更が更新される間、フォームの見出しのみが表示されます。現在、フォームが再び利用可能になるまで手動でページを更新しています。

これが私のhtmlとjqueryのスニペットと読み込みコードです。ローディング コードが機能しません。

メッセージをロードするためのコード

 $(document).ready(function() {
              $('<div id="loading">Loading...</div>')
                .insertBefore('#myform')
                .ajaxStart(function() {
                  $(this).show();
                }).ajaxStop(function() {
                  $(this).hide();
                });
            });
4

2 に答える 2

1

画像をロードするための最も簡単なソリューションとして、jquery プラグインprettyLoaderを使用できます。

DOM が次のようにロードされたら、プラグインを初期化するだけで済みます。

<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $.prettyLoader();
    });
</script>

そして、ajax リクエストが行われるたびに、読み込みアイコンを自動的に表示します。

テーブルの更新は、次の 2 つの方法で行うことができます。 ajax リクエストで HTML をロードし、単純に上書きします。

$('#myTable').innerHtml = data;

または、テーブル データを含む json オブジェクトを返し、このデータをテーブルに入れることができます。そのためには、 Knockout.jsなどのある種の Viewmodel を使用することをお勧めします。

于 2012-11-15T16:57:34.523 に答える
0

これをスクリプトに追加できます：

// to show the loading spinner

$("#loading").ajaxStart(function(){
    $('#loader').show();
});

// to hide the loading spinner

$("#loading").ajaxStop(function(){
    $('#loader').hide();
});

loader は、幅と高さが 100% の絶対位置の div 要素を持つ div になり、中央に読み込み中の gif が表示されます (必要に応じて、または読み込み中の単なるテキスト メッセージである可能性がある場合は、お待ちください... このように)

于 2012-11-15T17:20:11.500 に答える