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

似乎您的代码可以稍微改进：

$('#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 回答
0

加载后触发函数

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

为此，您应该在绑定 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

尝试这个 ，

$(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 

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