Bootstrap：初期ラジオボタンをHTMLに設定しました

Question

BootstrapのJavaScriptボタンを使用してラジオボタンのスタイルを設定していますが、初期のボタンをオンに設定していないようです。

は、ここに私のコードです：

<div class="btn-group" data-toggle="buttons"> 
    <label class="btn btn-info"> 
    <input checked="checked" type="radio" id="match-three" name="options">Three numbers 
    </label> 
    <label class="btn btn-info"> 
    <input type="radio" name="options" id="match-four">Four numbers 
    </label> 
</div> 

最初のボタンがchecked="checked"を持っているが、確認としてそれはスタイリングされていません。

ボタンはクリックイベントの後にはスタイリングされているので、初期ロード時に何が問題になるのかよく分かりません。

ここ

Bootplyバージョン：あなたのために働いていないものを明確にする必要がありますので、

<label class="btn btn-info active"> 
    <input checked type="radio" id="match-three" name="options">Three numbers 
</label> 

checked="checked" should work as well：あなたがHTML 5のdoctypeを使用している場合http://bootply.com/89566

Answer 1

は、単に任意の値なしcheckedを使用君は。

• 正しい視覚状態

Reference documentationをセットするlabelにactiveクラスを追加するフォームフィールド

に正しい状態を保証するinputにchecked属性を持ちます。

Answer 2

あなたがchecked入力を認識するためのブートストラップbutton()コンポーネントをしたい場合は、最初に、あなたはこれは、グループ内の適切なボタン/ラベルにアクティブ状態を設定します。..

$('[checked="checked"]').parent().addClass("active"); 

のようないくつかのjQueryを追加する必要があります。

Answer 3

Skellyのように、アクティブクラスはブートストラップがトグルしているもので、チェック属性を調べません。あなたは

<label class="btn btn-info active"> 
    <input checked type="radio" id="match-three" name="options">Three numbers 
</label> 

は、あなたが探しているもの、あなたを与えるだろう...しかし、JavaScriptでそれを行う必要はありません。