的 JS

Question

我正在使用ajax将XML加载到表中并尝试执行“悬停”事件以在悬停进出表行时更改颜色。使用AJAX动态添加表行。它不起作用。以下是代码：

$(document).ready(function(){
    //$("tr").hover(function(){
    $("#tbl1").on("hover","tr",function(){
       $(this).attr('bgcolor', "yellow");
    },
    function(){
       $(this).attr('bgcolor', "white");
    });     
});

以下是页面加载时的表格

<table width="200" border="5" cellspacing="5" cellpadding="5" id="tbl1">
     <tr>
       <th scope="col">Index</th>
       <th scope="col">Matriks</th>
       <th scope="col">Name</th>
       <th scope="col">IC</th>
       <th scope="col">Age</th>
       <th scope="col">Photo</th>
     </tr>
</table>

提前感谢任何帮助

Answer 1

使用此功能

$("#tbl1 tr").live("hover",function(){
   $(this).attr('bgcolor', "yellow");
},
function(){
   $(this).attr('bgcolor', "white");
});

Answer 2

试试这个

$(document).ready(function(){
    $("#tbl1").on("mouseenter","tr",function(){
       $(this).attr('bgcolor', "yellow");
    },
    function(){
       $(this).attr('bgcolor', "white");
    });     
});

悬停是mouseenter和mouseleave事件的简写形式。这样悬停不是一个事件。而.on（'hover'..不是一个有效的语法。但是你可以直接使用$（“＃tbl1 tr”）。hover（function（）{}）。

Answer 3

使用.css()代替.attr()

$(document).ready(function () {
    $("#tbl1 tr").hover(function () {
        $(this).css("background-color", "yellow");
    },

    function () {
        $(this).css("background-color", "white");
    });
});

选中此JSFiddle

Answer 4

将鼠标悬停在tr上以突出显示tr

工作演示http://jsfiddle.net/4SjZ7/1

$(document).ready(function () {
    $("#tbl1 tr").hover(function () {
        $(this).attr('bgcolor', "yellow");
    },
    function () {
        $(this).attr('bgcolor', "white");
    });
});

如果你想将鼠标悬停在表格上并突出显示该代码

的tr

工作演示http://jsfiddle.net/4SjZ7/3/

的 JS

$(document).ready(function () { $("#tbl1").hover(function () { $('#tbl1 tr').attr('bgcolor', "yellow"); }, function () { $('#tbl1 tr').attr('bgcolor', "white"); }); });

Answer 5

试试这个：

$(document).ready(function() {
    $("#tbl1").on("mouseenter", "tr", function() {
        $(this).attr('bgcolor', "yellow");
    }).on("mouseleave", "tr", function() {
        $(this).attr('bgcolor', "white");
    });
});

<强> jsFiddle

Answer 6

这似乎对我有用： http://jsfiddle.net/Sde8J/2

$(document).ready(function(){

  $("#tbl1 tr").hover(
  function () {
    $(this).css("background-color", "yellow");
  },
  function () {
    $(this).css("background-color", "white");
  });
});

jQuery on（）函数和悬停事件

6 个答案:

的 JS