jquery - 检测通过 CSS 内容 url() 插入的图像的点击？

Question

我正在向页面上所有类为“myClass”的元素添加“删除我”图标:

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

然后，我使用事件委托(delegate)通过监听包含元素的点击来检测对所有这些图标的点击:

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

但是，每当用户点击类为 myClass 的 div 时，XXX 中的代码就会被触发；有没有办法让我查明点击是否专门发生在我使用 CSS 的 content 属性插入的其中一个图标上？

编辑:从下面的答案来看，这似乎不起作用，因为图像没有添加到 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 类的每个新 div 执行相同的操作？ (我没有使用那些漂亮的事件处理插件之一，这些插件甚至为与选择器匹配的尚未创建的元素添加事件处理程序。)

或者有更聪明的方法来做到这一点吗？

预先感谢您的帮助，

拉拉

Answer 1

不，这是不可能的。

插入的内容没有 DOM 元素。并且事件绑定(bind)到 DOM 元素。

您必须添加一个图标作为其自身的 DOM 元素。