Question

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

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事件处理插件之一，即使是与匹配其选择器的尚未创建的元素。）

或者有更聪明的方法吗？

提前感谢您的帮助，

拉拉

Answer 1

不，这是不可能的。

插入的内容没有DOM元素。事件与DOM元素绑定。

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

Answer 2

根据Safari的Web Inspector，css：after不会改变DOM，所以我认为不可能从JavaScript中检测点击。

检测通过CSS内容url（）插入的图像的点击？

2 个答案: