使用javascript来点击伪元素？ [英] Use javascript to click on a pseudo-element?

问题描述

我想知道如何启用点击：之前伪元素（在JSfiddle的div的橙色部分链接到下面）。我已经阅读，因为伪元素不在DOM中，你需要一个hack为此。不幸的是，我找不到一个实际显示工作代码的现有Stackoverflow Q& A。

I'm wondering how to enable the clicking on a :before pseudo-element (the orange part of the div on the JSfiddle I link to below). I've read that since pseudo-elements aren't in the DOM you would need a hack for this. Unfortunately, I can't find an existing Stackoverflow Q&A that actually shows working code.

链接：http://jsfiddle.net/Vv6Eb/4/

HTML：

<div></div>

CSS：

div { position:relative; background-color:#333;
      padding:20px; margin:20px; float:left; 
}

div:before { content:""; display:block; 
    padding:5px; background-color:#f60; border:2px solid white; 
    position: absolute; top:-2px; right:-2px; border-bottom-left-radius: 10px; 
}

推荐答案

向该项目动态附加< span> 并为其分配一个点击方法。 喜欢这个小提琴。

A workaround for this would be to dynamically append a <span> to the item and assigning a click method to it. Like this fiddle.

var item = $('<span />');
item.click(function() { alert('click'); });
$('div').append(item);

CSS

div { position:relative; background-color:#333;
      padding:20px; margin:20px; float:left;
}

div span { content:""; display:block;
    padding:5px; background-color:#f60; border:2px solid white;
    position: absolute; top:-2px; right:-2px; border-bottom-left-radius: 10px;
}

这篇关于使用javascript来点击伪元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！