Question

我有一个包含一些信息的块。这个div有一个名为.remove的隐藏按钮。当你点击那个块时，它会把你带到另一边。当您使用鼠标输入div时，会出现按钮。当然按钮也是可点击的。但我的问题是按钮是一个块，这意味着当我点击按钮时它也会把我带到另一边。我不想要那个动作。使用CSS或/和jQuery的方式是如何在单击按钮时阻止转发到另一端？

HTML：

<a href="/asite">
    ...
    <input type="button" class="remove" value="Remove" />
    ...
</a>

Answer 1

将其应用于按钮

$('button').click(function(e) {
    e.stopPropagation();
});

这将停止点击冒泡到包含div，这会导致div上的click事件发生。

更多信息：https://api.jquery.com/event.stoppropagation/

Answer 2

单击该块时 - 运行常规块代码 - 除非您单击内部按钮

$('block-selector').on('click', function(event) {
  if (!$(event.target).closest('button-selector').length) {
    // Run block code.
  }
});

现在，当您单击内部按钮时，块代码不会干扰。

查看Philip Walton的this post关于使用此技术的类似问题

CSS - 整个div可点击但区域不是

2 个答案: