0

次のコードは、任意の行がクリックされた場合に正常に機能します。

$(document).ready(function() {  
$('#currentloc_table tr').click(function(event) {
    $("#"+$(this).attr('id')+" input:checkbox")[0].checked = !  ($("#"+$(this).attr('id')+" input:checkbox")[0].checked);
    if($("#"+$(this).attr('id')+" input:checkbox")[0].checked == true)
        $(this).addClass('selected');
    else if($("#"+$(this).attr('id')+" input:checkbox")[0].checked == false)
        $(this).removeClass('selected');    
});
});

CSSは次のとおりです。

.selected td {
background: yellow;
}

ページの読み込み時に必要なのは、このテーブルの最初の行が強調表示されることです。どうやってやるの?

4

7 に答える 7

3

これを試して

$(document).ready(function () {
    $('#currentloc_table tr').click(function (event) {
            $("#" + $(this).attr('id') + " input:checkbox")[0].checked = !($("#" + $(this).attr('id') + " input:checkbox")[0].checked);
            if ($("#" + $(this).attr('id') + " input:checkbox")[0].checked == true)
               $(this).addClass('selected');
            else if ($("#" + $(this).attr('id') + " input:checkbox")[0].checked == false)
                $(this).removeClass('selected');
    });
    // Add these lines
    var firstTr = $('#currentloc_table tr:first');
    firstTr.addClass('selected');
    firstTr.find("input:checkbox")[0].checked = true;
});

作業デモ

于 2013-02-16T10:55:52.840 に答える
1

この使用を試す.first():first()、ターゲットを選択できます。

$(document).ready(function() {  
   $('#currentloc_table tr').first().addClass('selected');
   ....

また:

$(document).ready(function() {  
   $('#currentloc_table tr:first').addClass('selected');
   ....

あなたはこれらを見ることができます:

  1. .eq():eq()
  2. nth-child()
  3. :first-child

ドキュメントを読む

于 2013-02-16T10:53:40.710 に答える
0

$(document).ready(function () {
     $('#currentloc_table').find('tr:first').addClass('selected');
});
于 2013-02-16T11:12:31.790 に答える
0

これを試して 、

$(document).ready(function() {  
$('#currentloc_table tr').first().addClass('selected_f');
  // rest of your stuff ....

そしてcss

.selected_f {
     background: yellow;
} 

あなたのCSSクラスは選択したクラスのデフォルトとして取っているので、そのクラスを追加せず、効果を見ることができません

于 2013-02-16T12:27:10.163 に答える
0

ロード後に関数をトリガーする

$('#currentloc_table tr:first-child').trigger('click');

これを機能させるには、クリックイベントをバインドした後にこれを追加する必要があります:

 #currentloc_table tr
于 2013-02-16T10:53:25.680 に答える
0

これで試してください

$(document).ready(function(){
     $("#currentloc_table tr:first"):css('background','yellow');
})

または、試してみてください

$("#currentloc_table tr").eq(0):css('background','yellow');
于 2013-02-16T10:54:29.597 に答える
0

コードを少し改善できるようです:

$('#currentloc_table tr').click(function (event) {
    var check = $("input:checkbox", this)[0];
    check.checked = !check.checked;
    $(this)[check.checked ? 'addClass' : 'removeClass']('selected');
});

最初の行を選択するには:

$('#currentloc_table tr:first').click();
于 2013-02-16T10:59:37.967 に答える