jquery - 动态附加表格元素的绑定

Question

我创建了一个由 JSON 数据填充的表，因此表中的每一行。表布局是 <table id="custServMainTable"> <tbody> </tbody> </table>

我用 JQuery 附加元素，代码位于页面底部

$('#custServMainTable tbody').append("<tr class='custCell grey'>
<td>info</td></tr>");

元素的附加工作正常。我遇到的问题是，当我尝试运行悬停来更改背景颜色时

$('.grey').hover(function() {
        $(this).css('background-color', '#FDBB73');}, 
        function() {$(this).css('background-color', '#EFEFEF');
    });

尝试过的方法

 $('.grey').on("hover", function(event) {
        $(this).css('background-color', '#FDBB73');}, 
        function() {$(this).css('background-color', '#EFEFEF');
    });

我试图在悬停时突出显示一行。它不适用于我尝试过的方法。我以前使用相同的代码来静态创建表。我尝试过使用悬停功能“打开”和“绑定”，但没有成功。其他类似情况的示例建议使用 live，现在已弃用。有人建议将“on”上移一级，但这并没有取得任何成功。

Answer 1

.on()没有悬停选项。您可能想尝试：

$('body').on('mouseenter', '.grey', function() {
   $(this).css('background-color', '#FDBB73');}
});
$('body').on('mouseleave', '.grey', function() {
   $(this).css('background-color', '#EFEFEF');
});