Question

我想让这个div可以点击并希望在href内使用相同的<a>，并且想要在<a>内部保持链接（所以如果JS被禁用则链接将是可访问的。）

<div id="example">

<p> some text </p>

<img src="example.jpg />

<a href="http://stackoverflow.com"> link </link>

</div>

我的意思是我需要这样。

<div id="example" href="http://stackoverflow.com">

<p> some text </p>

<img src="example.jpg />

<a href="http://stackoverflow.com"> link </link>

</div>

Answer 1

这样的事情应该做

$('#example').click(function() {
  window.location.href = $('a', this).attr('href');
});

Answer 2

我还不能回复上述对话，因为我是新来的，但我只想说你不需要return false来自这个功能。这样做是为了防止事件的默认行为发生（在单击div的情况下是什么都没有）并阻止事件传播到DOM层次结构中的下一个元素。

对于这种情况，这些都不太可能是必要的。此外，如果您确实需要这些行为，您可以单独更清楚地获取这些行为：

// note that the function will be passed an event object as
// its first argument.
$('#example').click(function(event) { 
  event.preventDefault(); // the first effect
  event.stopPropagation(); // the second

  window.location.href = $('a', this).attr('href');
});

同样，我不认为在这种情况下这两种方法都是必要的，但重要的是要了解它们是如何工作的，因为你需要经常使用其中一种或两种。

Answer 3

<html>  
  <body>
    <div onclick="window.location.href = this.getElementsByTagName('a')[0].href;">
      <p>some text</p>      
      <a href="http://www.google.co.in/">link</a>
    </div>
  </body>
</html>

Answer 4

上述答案都被我接受了。通常你可以做同样甚至更好 css对“div”的影响大于“a”。并且您可以添加js函数来显示事件发生时的css更改，如Click。也许是这样的：DIV.onclick = function（）{在这里改变目标dom对象css}。然后当事件发生时，你会看到效果。如果你想将href改为另一个。写像location.href =“http://www.target.com”的js;它会对你有用。

如何使div可点击？

4 个答案: