0

jquery を使用してチェックボックスをターゲットにしようとしているテーブルがあります。個々の td 内のチェックボックスをクリックして、その td の背景色を変更したいのですが、チェックボックスをまったくターゲットにできないようです。これは私のテーブルの tr です (さらに多くの td があります。このエラーのために 2 つ含めました。

<tr class="sources">
  <td><a href="#">Single Life Annuity</a></td>
  <td>
    <div class="left"><input type="checkbox"></div>
    <div class="right">
      <span class="relval">100%</span>
      <span class="benyou">$517.00</span>
      <span class="benben">$0</span>
    </div>
  </td>
  <td>
    <div class="left"><input type="checkbox"></div>
    <div class="right">
      <span class="relval">98%</span>
      <span class="benyou">$2,916.00</span>
      <span class="benben">$0</span>
    </div>
  </td>
</tr>

これは、チェックボックスを見つけるために使用しているjqueryです。チェックボックスが見つかったことを確認するためにconsole.logを使用していますが、本質的には使用しますaddClass(".active");

 $(".sources td").click(function(e)
 {
   $(this).parent().find('input:checkbox').attr('checked', 'checked');
   console.log('you got it!');
 });

どんな助けでも素晴らしいでしょう!! 前もって感謝します。

4

4 に答える 4

1

あなたの例（テーブルセルのクリックにバインドされています）を使用すると、セルが選択され、赤い背景が適用されます。

$(this).css('background','red');

jsFiddle の例

チェックボックスのクリックイベントにバインドしたい場合は、これを試してください：

$(".sources td input").click(function (e) {
    $(this).parent().find('input:checkbox').attr('checked', 'checked');
     $(this).closest('td').css('background','red');
    console.log('you got it!');
});

jsFiddle の例

于 2013-03-12T20:17:15.080 に答える
1 
$('input[type="checkbox"]').click(function() {
    if($(this).is(':checked')) {
        $(this).parent().parent().addClass('active');
    } else {
        $(this).parent().parent().removeClass('active');
    }
});
于 2013-03-12T20:19:04.930 に答える
0

.prop（）メソッドを使用することもできます。

 $(this).parent().find('input:checkbox').prop("checked", true);

http://api.jquery.com/prop/

于 2013-03-12T20:24:18.193 に答える
0

必要に応じて:デモ

$('input[type="checkbox"]').click(function() {
    if($(this).is(':checked')) {
        $(this).parent().parent().css('background','red');
    } else {
       $(this).parent().parent().css('background','white');
    }
});

他の方法では、次の場所をクリックして動作し<td>ます: DEMO

$(".sources td").click(function (e) {
    if ($(this).find('input:checkbox').is(':checked')) { 
        $(this).find('input:checkbox').attr('checked', false);
        $(this).closest('td').css('background','white');
    }
    else
    {
        $(this).find('input:checkbox').prop('checked', 'checked');
        $(this).closest('td').css('background','red');
    }
});
于 2013-03-12T20:30:45.990 に答える