javascript - 使用javascript点击伪元素？

Question

我想知道如何启用对 :before 伪元素的点击(我在下面链接的 JSfiddle 上 div 的橙色部分)。我已经读到，由于伪元素不在 DOM 中，因此您需要 hack。不幸的是，我找不到实际显示工作代码的现有 Stackoverflow 问答。

链接: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; 
}

Answer 1

如果您知道圆圈“应该”在哪里，您可以使用三 Angular 函数来查看点击是否在圆圈内:http://jsfiddle.net/Vv6Eb/19/

$("div").click(function(e){
    var $me = $(this),
        width = $me.outerWidth(),
        height = $me.outerHeight(),
        top = $me.position().top,
        left = $me.position().left;

    var len = Math.sqrt(Math.pow(width - e.offsetX, 2) + Math.pow(e.offsetY, 2));

    if (len < 10)
        alert('ding');
});​