关于使用jQuery进行表操作的三个问题

Question

1. 如何在鼠标开启时突出显示该行，然后在鼠标停用时取消突出显示

2. 如何使用新值更新指定的行？

3. 如何获取表格中的行数？

修改： 对q2的最佳答案的那个将被标记为这篇文章的答案：）

Answer 1

一：

$('#mytable').find('tr').hover(function() {
    $(this).addClass('active');
}, function() {
    $(this).removeClass('active');
});

与此CSS一起：

#mytable tr.active td {
    background-color: #ccc;
}

两个

你说更新了一个“行”，但你可以真正更新的只是单元格，除非你想要创建全新的单元格。

$(cell).html('Contents');

或者：

var $cell = $('<td>').html('Contents');
$(row).html($cell);

或者如果表格行有3个单元格，则更新第一个单元格：

$(row).find('td').eq(0).html('Contents');

三

$('#mytable').find('tr').length;

Answer 2

对于第一个问题：

$("#table1 tr").hover(
   function()
   {
    $(this).addClass("highlight");
   },
   function()
   {
    $(this).removeClass("highlight");
   }

关于第三个问题：

var count = $("table1 tr").length

Answer 3

<强> 1 即可。 http://docs.jquery.com/Events/mouseover

我相信你可以使用这个或.hover。

$('tr').mouseover(function() {

    $(this).addClass('over');

}).mouseout(function() {

    $(this).removeClass('over');

});

在CSS中添加一个over class。

<强> 2 即可。您不更新行，更新行内的表格单元格。

$('tr:first td:first').text( 'something' )

第3 即可。

alert( $('table tr').length ); // count all descendant table rows