59

私は自分のウェブサイトでこの正確な例を動作させようとしています:

http://getbootstrap.com/2.3.2/javascript.html#buttons

ただし、次の HTML を含めるだけです。

<button type="button" class="btn btn-primary" data-loading-text="Loading...">Loading state</button>

動作しません。jQuery 1.7.x を実行しており、Bootstrap JS ファイルをロードしました。

具体的には、ボタンを「読み込み中」のテキスト変更に移動して少し遅れてから、通常のテキストに戻るようにします。私のグーグルからオンラインで入手できる良い例はないようです（ほとんどは、永続的な状態の変更またはトグルを求めています）。Bootstrap サイト自体には、ドキュメントがありません。

4

7 に答える 7

103

ドキュメント ページには、application.js というファイルが読み込まれています。http://twitter.github.com/bootstrap/assets/js/application.js

// button state demo
$('#fat-btn')
    .click(function () {
        var btn = $(this)
        btn.button('loading')
        setTimeout(function () {
            btn.button('reset')
        }, 3000)
    });
于 2012-08-25T00:33:17.277 に答える
21

または、これを追加して、Twitter Bootstrap 属性を取得します。

$('button[data-loading-text]').click(function () {
    $(this).button('loading');
});
于 2013-06-19T10:33:04.300 に答える
6

button('loading') を実行する前に、受け入れられた回答が jQuery ボタン オブジェクトを js var に変換した方法を書き留めます。これは機能しますが、jQuery ボタン オブジェクトで直接使用すると button('loading') が機能しないためです。 .

于 2012-11-20T00:45:13.187 に答える
1

また、jquery には .delay() メソッドがあり、setTimeout よりも簡単に操作できます。

于 2012-09-19T19:30:40.353 に答える
-7

小さなjsを入れるだけです

onclick="$(this).button('loading');"
于 2013-05-18T16:48:54.637 に答える