如何使用锚点使整个DIV可点击…但是在该DIV内，有一个不跟随该锚点的输入按钮？

Question

我尝试了这个：

<div style="display:block;">
<a href="/go" style="display:block;height:100%;width:100%;position:absolute;"></a>
LOTS OF STUFF HERE 
<input type="button" onclick="runsomething();return false;">
</div>

但这是行不通的。 它确实单击以跟随锚点...但是按钮也跟随锚点，这是我不想要的。

编辑：该按钮甚至不会单击。 它不会按下！ 就像锚完全覆盖了它一样。

Answer 1

您可以使事件从向上的按钮停止传播，从而使其永远不会到达DIV。

$(".myDiv input").click(function(e){
  e.stopPropagation();
});

有关event.stopPropagation更多信息，请参见http://api.jquery.com/event.stopPropagation/

由于某种原因，您的锚点占用了父容器的整个大小。 为什么？ 这将掩盖您的按钮，可能使其无法操作。 我了解您想使整个DIV都可点击，但这是错误的方法。 考虑以下：

$(".myDiv").click(function(){
  window.location = $("a:first", this).attr("href");
});

这将导致对该DIV的单击，将用户发送到其链接将其发送到的任何位置。 最好的事情是，您无需在链接或DIV中添加任何CSS。 Javascript会在div中找到链接，获取其href值，并向该方向发送用户。