web-dev-qa-db-ja.com

Bootstrap 3のロード状態ボタン

Bootstrapが初めてです。3.読み込み状態ボタン機能を有効にする方法がわかりません。以下の私のコードは getboostrap.com のドキュメントからのものです。

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

ドロップダウンはうまく機能するので、問題はどこかにあると思いますか？

jqueryhtmltwitter-bootstrap
46
kanarifugl

HTMLをそのままにして、js側からのクリックを検出する必要があります。 注：このメソッドはv3.5.5から非推奨になり、v4で削除されました。

$("button").click(function() {
    var $btn = $(this);
    $btn.button('loading');
    // simulating a timeout
    setTimeout(function () {
        $btn.button('reset');
    }, 1000);
});

また、ページにjQueryおよびBootstrap js（jQueryに基づく）ファイルをロードすることを忘れないでください。

JSFIDDLE

公式ドキュメント

116
Ionică Bizău