2010-01-09 72 views
1

我在我的頁面上的所有元素中添加了一個「刪除我」圖標,類爲「myClass」:檢測通過CSS內容url()插入的圖像的點擊?

div myClass:after 
{ 
    content: url('remove-me-icon.jpg') 
} 

然後我使用事件委派通過監聽包含元素的點擊來檢測所有這些圖標的點擊次數:

$("#myDivThatContainsThoseOtherDivs").click(function(e){ 
if ($(e.target).is('.myClass:after'): 
{ 
    // XXX... remove this element 
} 
}); 

但是,每當用戶點擊具有類myClass的div時,XXX中的代碼就會被觸發;有沒有辦法讓我知道點擊是否特別發生在上我用CSS的內容屬性插入的那些圖標之一?

編輯:從下面的答案似乎這不起作用,因爲圖像沒有被添加到DOM。如何才能達到同樣的效果?我是否堅持使用jquery

$("div.myClass").each(
/* 
function that appends html to this element defining a clickable 
icon with class "myClickableIcon" 
*/); 

$("#myDivThatContainsThoseOtherDivs").click(function(e){ 
if ($(e.target).is('.myClickableIcon'): 
{ 
    // XXX... remove this element 
} 
}); 

,然後爲每個新的類myClass做同樣的事情? (我沒有使用那些添加事件處理程序的spiffy事件處理插件之一,即使是與其選擇器匹配的尚未創建的元素。)

或者有更聰明的方法嗎?

提前感謝您的幫助,

lara

回答

2

不,這是不可能的。

插入的內容沒有DOM元素。事件綁定到DOM元素。

您必須自行添加一個圖標作爲DOM元素。

2

根據Safari的Web Inspector的css:after不會改變DOM,所以我不認爲它有可能檢測到JavaScript的點擊。