如何刪除僅在jquery中使用append（）追加的標籤

Question

我有一個div在鼠標上方彈出，我使用html（）插入一些內容。而且我想讓代碼的一部分保持不動，

<div id="pop_div" ><span>X</span></div> 


$("#team_div > ul img").bind('mouseenter',function(){ 
    $("#pop_div").html('<img src="' + img + '"/>' + content); 
}); 

和onclick我隱藏分區。

$('#pop_div span').click(function(){ 
    $("#pop_div").hide(); 
}); 

我的問題是，我不能使用下面的代碼因爲jQuery不會爲標籤

$("#pop_div").html('<span>X</span><img src="' + img + '"/>' + content); 

分配的任何事情（我不能使用的liveQuery插件）

我很欣賞你的意見。

Answer 1

您正在替換#pop_div的全部內容，當您插入HTML代碼時，正在創建新的DOM元素，這就是事件未綁定的原因。

span元素已從DOM中刪除，並且附加到它的事件不再有效。

我覺得你不需要替換該div的所有內容，你可以組織你的DIV像這樣：

<div id="pop_div" > 
    <span>X</span> 
    <img/> 
    <div id="content"></div> 
</div> 

在你的mouseenter：

$('#team_div > ul img').bind('mouseenter',function(){ 
    $('#pop_div img').attr('src', img); // set the image source 
    $('#pop_div #content').html(content); // display the content 
}); 

的圖像源改變，並將content變量插入到'#content' div中。

由於span元素不受影響，您的點擊處理程序將保持現在的樣子。

Answer 2

CMS是正確的。另外從jQuery 1.3開始，你可以綁定事件with the live function，它將事件綁定到當前和將來的所有元素。

$('#team_div > ul img').live('mouseenter',function(){ 
    $('#pop_div img').attr('src', img); // set the image source 
    $('#pop_div #content').html(content); // display the content 
});