开发者

JQuery highlighting a row in an ajax loaded table

A page contains two tables. First table is loaded together with the whole page and the second table is loaded afterwards with the help of ajax.

Both tables contain links in each their row.

After clicking a link the corresponding table row (where link is) should be highlighted.

With the first table there are no problem. The following works ok:

$(document).ready(function () {
        $('#firstTable tr a').click(function (event) {               
            $('#firstTable tr').css("background-color", "white");
            $(this).closest('tr').css("background-color", "silver");
        });
    });

But there are problems with the second table. I try to use .live() method but with no success, it doesn't react on clicks:

function onLoad() {
              $('#secondTable tr a').live('click', function () {
                  highlChooseRow();
              });
          }

          function highlChooseRow() {
              $('#secondTable tr').css("background-color", "white");
              $(this).closest('tr').css("background-color",开发者_JAVA百科 "silver");
          }

What am I doing wrong?


How about

$(document).ready(function () {
    $('#firstTable tr a, #secondTable tr a').live('click', function (event) {               
        $(this).parent('table').find('tr').css("background-color", "white");
        $(this).closest('tr').css("background-color", "silver");
    });
});

should work without any problems. for cleanup you could also define some class '.higlightable-table' or something like that and use $('.hightlightable-table a').live ...

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜