Question

我将span附加到div上的mouseover，我只是想触发嵌套范围上的点击。感觉就像我已经尝试了一切都不走运。

我发现了几个相似但不幸的是它们也没有成功。

Answer 1

将您的mouseover更改为mouseenter并使用事件委派

$('.container').on('mouseenter', function (e) {
    $(this).append('<span class="span1">I want this to be clickable..</span>');
}).on('mouseleave', function (e) {
    $(this).find('.span1').remove();
});

$('.container').on('click', '.span1', function () {
    alert("click");
});

Demo

使用鼠标悬停，即使将鼠标悬停在子跨度上也会触发，并且它会继续移除并附加跨度。

来自doc

的

mouseenter事件在处理事件冒泡的方式上与鼠标悬停不同。如果在此示例中使用鼠标悬停，则当鼠标指针移过Inner元素时，将触发处理程序。这通常是不受欢迎的行为。另一方面，mouseenter事件仅在鼠标进入绑定的元素而不是后代时触发其处理程序。因此，在此示例中，处理程序在鼠标进入外部元素时触发，而不是内部元素。

鼠标悬停期间附加的跨度上的单击事件未触发

1 个答案:

Demo