jQueryの複数のラジオボタン

StackOverflow https://stackoverflow.com/questions/209874

  •  03-07-2019
  •  | 
  •  

質問

javascript / jqueryの新機能で、＆quot; this＆quot;の使用に苦労しています。または＆quot; $（this）＆quot;現在のオブジェクトを取得します。

各行に「s_」という名前のラジオボタンのセットを持つテーブルがあります。デフォルトでは、どのラジオボタンもチェックされていません：

<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_0">
         <input type="radio" name="s_0" value="1" />Public
         <input type="radio" name="s_0" value="2" />Not Public
         <input type="radio" name="s_0" value="3" />Confidential
      </div>
   </td>
</tr>
<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_1">
         <input type="radio" name="s_1" value="1" />Public
         <input type="radio" name="s_1" value="2" />Not Public
         <input type="radio" name="s_1" value="3" />Confidential
      </div>
   </td>
</tr>

ユーザーがラジオボタンを選択するたびにテーブルに新しい行を追加するjQuery関数を記述しようとしていますが、それらが現在テーブルの最後の行にある場合のみです。私がやりたいのは、クリックされたラジオボタンの名前属性を取得し、それを解析して行インデックス（つまり「_」の後の部分）を取得し、それをテーブル内の行数と比較することです。それらが等しい場合、新しい行を追加します。それ以外の場合、何もしません。

これを攻撃する方法に応じて、私の質問は2つあります。

1）ラジオボタンの名前属性を返す方法、または 2）現在いる行の行インデックスを返すにはどうすればよいですか？

役に立ちましたか？

解決

これにより、指定したHTMLを使用してインデックスが取得されます。

$(document).ready(function() {
    $("input:radio").click(function() {
        var index = parseInt(this.name.split('_')[1])
    });
});

もう1つ役立つことがあります：テーブル内の行数を取得します：

$($("table").children()[0]).children().length

これがあなたの道に役立つことを願っています。

他のヒント

特定の質問について1＆amp; 2、テーブルに＆quot; mytable＆quot;のIDを指定した場合、この例では探しているものが表示されます。

var rowIndex = $("#mytable tr").index($(this).parents("tr"));
var inputName = $(this).attr("name");
alert("Input Name: " + inputName + "; RowIndex: " + rowIndex);

これは私の頭の上の、テストされていないコードです：

$("#div_s_0 input[type='radio']").onclick = function() {
    if ($("#div_s_0 input[type='radio']:last").attr('checked') == 'checked') {
    /* add a new element */
    }
}

それは、divの各ラジオボタンにonclickイベントをアタッチすることです。 onclickは、そのグループの最後のラジオボタンがチェックされているかどうかを確認し、チェックされている場合は別の要素を追加します。

私が言ったように、まだテストされていません。セレクター（＃ div_s_0 ...：last ）が不明なので、最初にFirebugで実行してください。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top