ラジオボタンにクリックイベント発火させたい

Question

前提・実現したいこと

bootstrap4のタブ機能を使っており、あるタブ内でラジオボタンを選択したら次のタブを表示させたいです。

発生している問題・エラーメッセージ

現在、ラジオボタンの要素をクリックし、選択しても発火しない状況です。

該当のソースコード

  $('#sample_btn input[type=radio]').on("click",function() {
    $('.nav-tabs a[href="#sampleB"]').tab('show');
  });

//タブの表示設定
    <ul id="myTabs" class="nav nav-tabs">
      <li class="nav-item">
        <a href="#sampleA" class="nav-link active" data-toggle="tab">A</a>
      </li>
      <li class="nav-item">
        <a href="#sampleB" class="nav-link" data-toggle="tab">B</a>
      </li>
　　</ul>

//タブの中身
      <div role="tabpanel" class="tab-pane fade" id="sampleA">
        <div class="btn-group btn-group-toggle" data-toggle="buttons" id="sample_btn">
          <label class="btn btn-secondary">
            <input type="radio" name="samplecontent1"> A　//<label>は複数あります。
          </label>
        </div>
      </div>

Answer 1

<input>を囲んでいる<label>にidまたはclassを指定することでできました。

Answer 2

発火はしているのでは？

アンカーに対してtab('show')をするという仕様で間違いないのでしょうか？
もしactiveを変えるだけならそういう処理をかけば良い気もします
（それがtab処理なのかもしれないのでなんとも言えませんが）

Comments

[yassan511]

https://qiita.com/komakomako/items/882e9d4a48693cee491f
この記事を参考にし、記事の通りだと動作するのでラジオボタン用に書き換えたんですけど動作しないですね。詳しくないので分かりませんが、記事の通りだとtab('show')で動作はしたので大丈夫かと思います。

Answer 3

clickじゃなくて　change　では？
【jQuery入門】ラジオボタン(radio要素)の取得・選択・checked操作！

Comments

[yassan511]

changeに変えてみましたが反応しなかったです。
となると、jsの2行目の記述に誤りがあるということですかね

[azuapricot]

https://webst8.com/blog/bootstrap4-tabs/
↑とかはもう見てみました？

[yassan511]

見てみましたが原因分からなかったですね