ブートストラップ4ベータ版：ブートストラップ4について

Question

をチェックされているBTN-グループ上のどの項目をチェック：

私は3つのラジオボタンとBTN-グループを持っており、そのうちの一つは、事前に選択されたページのロードにあります。私は選択されたボタンに応じていくつかのアクションを実行したいですが、私はそれを得ることができません。ここで

は、これまでの私のコードです：

<div class="btn-group btn-group-sm mb-2" id="container__Direction" role="group" data-toggle="buttons"> 

    <label class="btn btn-group-btn active"> 
    <input type="radio" data-toggle="button" id="input__Direction_Return" checked /> &lt;--&gt; Return 
    </label> 
    <label class="btn btn-group-btn"> 
    <input type="radio" data-toggle="button" id="input__Direction_OneWay" /> --&gt; One way 
    </label> 
    <label class="btn btn-group-btn"> 
    <input type="radio" data-toggle="button" id="input__Direction_MultiStop" /> -&gt;-&gt; Multi Stop 
    </label> 

</div> 

<!-- Hide this Div if "OneWay" is selected -->  
<div id="container__Inbound_Date"> 
    <label for="input__Date">Date:</label><br/> 
    <input type="date" id="input__Date" /> 
</div> 


$('#input__Direction_OneWay').on('click', function() { 
    if ($(this).is(':checked')) { 
     $("#container__Inbound_Date").hide(); 
    } 
}); 

はフィドル：https://jsfiddle.net/SchweizerSchoggi/ax85208e/2/

BTN "一方向" が選択された場合BTN-グループ下の事業部が非表示にする必要があります。

Answer 1

すべてのラジオボタンにname属性（同じ）を追加する必要があります。次に、on('click')の代わりにchange()を使用します。

$('input[name=YourName]').change(function() { 
if ($(this).attr('id') == 'input__Direction_OneWay') { 
    $("#container__Inbound_Date").hide(); 
    } 
}); 

Answer 2

$(document).on("click", "#input__Direction_OneWay", function() { 
    alert("Goodbye!"); 
}); 

をあなたは

$(".btn").first().button("toggle"); 

以下のように同じようにjQueryで使用することができますし、クリックイベントのコードの下に使用することができます