Question

我有这个代码

$.getJSON('check.php', function(data) {
    $.each(data, function(key, val) {  
        $("#badge").append("<tr><td>"+val+"</td></tr><tr><td>-------------------------------------------------------</td></tr>");
    });
});

$("td").mouseover(function () {
    $(this).css("color","red");
});

我的问题是当我将鼠标光标悬停在每个元素上时，它们不会像我预期的那样改变颜色...有人可以解释为什么???并帮助我如何做正确的事。

Answer 1

事件mouseover不会触发，因为加载时页面上没有元素...所以你需要这样做：

$("#badge").on('mouseover','td', function () {
    $(this).css("color","red");
});

on()函数将在badge元素（这是一个猜测表）上触发，并且仅在事件目标为td且事件为{{时触发1}}。

有一点需要注意 - 这可以通过css轻松完成：

mouseover

谢谢@WTK：

请记住，#badge td:hover { color: red; }从jQuery 1.7开始可用。对于旧版本的jQuery和类似结果，请使用on()，bind()或delegate()。

Answer 2

尝试使用live或on，因为您的元素是动态加载的。基本上这些函数的作用是允许您将事件处理程序附加到未来的元素。像这样使用它：

$("td").on('mouseover', function(){
    $(this).css({'color':'#F00'})
});

jquery添加新元素

2 个答案: