Jquery mouseenter不'；html更改后不会触发

我有如下html表格：

<div id="recommendation">
  <table id="category_selected">
    <tr>
      <td>1</td>
    </tr>
  </table>
</div>  

$(function()
{
    $("#recommendation tr").mouseenter(function()
    {   
        alert("Yes");
    }
}

一切正常。但当我用以下内容更改推荐的html时：

$.post("path/script.php", {dataIn: dataInEncoded}, function(data, status)
{
    if(status == 'success')
    {
        $("#recommendation").html(data);
        /*(data exactly the same as default html)
           <table id="category_selected">
             <tr>
               <td>1</td>
             </tr>
           </table>
        */
    }
}

$.post（“path/script.php”，{dataIn:dataInEncoded}，函数（数据，状态）
{
如果（状态=‘成功’）
{
$（“#建议”）.html（数据）；
/*（数据与默认html完全相同）
1.
*/
}
}

Jquery mouseenter突然不工作（触发）。

问题在于：

$("#recommendation tr").mouseenter(function(){

这适用于静态html元素，但在您动态添加某些html时，使用jquery

on（）

处理动态html，如：

$(document).on('mouseenter', '#recommendation tr', function(){

---

然后再试一次。

这是因为DOM的工作方式与您认为的不同。您已经用新的HTML有效地替换了该节点的内部。这意味着所有以前作为

#recommendation

子节点的节点都已从DOM中删除。由于这些行上有您的事件侦听器，因此这些事件侦听器也已从DOM中删除

您需要做的是在重新填充表后将事件侦听器重新连接到DOM。复制代码以在重新填充表后添加事件侦听器，然后查看发生了什么

---

或者，正如Mayank Pandeyz所说，使用jQuery.on函数。这样就不必重新连接。

您需要使用委托（“live”）函数

$("body").on("mouseenter","#recommendation tr",function()
{   
    alert("Yes");
}

该事件将侦听在第二个参数中侦听的、在“body”元素中存在或将创建的所有元素

例如，您可以将函数锚定到第一个不可变元素

$("#recommendation").on("mouseenter","tr",function()
{   
    alert("Yes");
}

1.
document.getElementById（“category_selected”）.onmouseover=function（）{mouseOver（）}；
函数mouseOver（）{
警惕（“是”）；
}

您在ajax请求中得到的响应是什么？为什么函数中有函数？

function（）{mouseOver（）}；

？它可能类似于

document.getElementById（“category_selected”）.onmouseover=mouseOver；

无论如何，它并不能解决问题。

<div id="recommendation">
  <table id="category_selected">
    <tr>
      <td>1</td>
    </tr>
  </table>
</div>  


document.getElementById("category_selected").onmouseover = function() {mouseOver()};
function mouseOver() {
    alert("Yes");
}