更改元素ID,但是jQuery仍然触发事件调用旧的ID.为什么这个工作？

我创建了一个小提琴,尝试调试一个问题,我曾经用jQuery重新排列html元素,这些元素上的悬停事件不再工作了.

但是,我在这里遇到了这个有趣的情况：http://jsfiddle.net/4yv1trj4/

我有一个主div改变颜色,一旦我徘徊在它.

$("#block").hover(function() {
     $(this).css("backgroundColor","red");
},function() {
    $(this).css("backgroundColor","#888");        
});

如果您单击按钮,主div的ID将更改为block2：

$("#block").attr("id","block2");

但$(“#block”).当我悬停在#block2上时,hover()仍然会触发.此外,#block2上的所有悬停调用都不起作用. jQuery是如何工作的基本原理将会解释这一点？

解决方法

当你这样做：

$("#block").hover(function() {
    $(this).css("backgroundColor","#888");        
});

你告诉jQuery来查找具有块ID的元素,并将悬停事件绑定到它.一旦这样做,事件将保持对该元素的约束,不管事后发生什么事情.

也就是说,除非你有一些代码,那就是unbinds.