Img onclick以上div onclick

Question

我有一个包含div的img。我希望div按一下将我重定向到一个页面，而img在div中单击以重定向到另一个页面。我玩过z索引和其他一些东西，但是当点击img时，我仍然会被重定向到div的重定向位置。

<div onclick="window.location='DivLink'" style="cursor:pointer; border-style:solid; z-index:1; background-color:teal">
    <br />
    <br />
    <img src="~/Images/3a6ef9b.jpg" style="z-index:2; overflow:visible" onclick="location.href='ImgLink'" />
</div>

Answer 1

使用event.stopPropagation()可以防止事件在DOM树上冒泡，从而防止任何父处理程序被通知该事件。

试一试

  $("div").click(function (e) {
    window.location = 'DivLink';
    alert(1);

});

$("img").click(function (e) {
    e.stopPropagation();
    alert(1);
    window.location.href = 'ImgLink';


});

演示

Answer 2

使用名为stoppropagation的东西来阻止单击事件发生在父元素上。

下面是示例 on W3Schools：