我有两个div,我想点击它。每个div都有一个锚链接,我想在每个div的链接中使用它。
我正在使用下面的帮助,它适用于左侧div但不适用于右侧。 http://css-tricks.com/snippets/jquery/make-entire-div-clickable
不太确定我缺少什么或者有更好的方法吗?理想情况下,我只想使用CSS,但即使禁用了js,此选项仍然有用。
任何帮助都会很棒。
$('.left').click(function(){
window.location=$(this).find("a").attr("href");
return false;
});
$('.right').click(function(){
window.location=$(this).find("a").attr("href");
return false;
});
<div class="left">
<div class="left-content">
<h2><a href="#">title</a></h2>
<ul>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>
</div>
</div>
<div class="right">
<div class="right-content">
<h2><a href="#">title</a></h2>
<ul>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>
</div>
</div>
答案 0 :(得分:5)
将DIV放在锚点中在HTML5中有效,并且向后兼容其他DOCTYPES。
<a href="#">
<div class="right">
<div class="right-content">
<h2>title</h2>
<ul>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>
</div>
</div>
</a>
答案 1 :(得分:2)
以这种方式使用:
$('.left').click(function(){
window.location=$(this).children("a:first").attr("href");
return false;
});
$('.right').click(function(){
window.location=$(this).children("a:first").attr("href");
return false;
});
答案 2 :(得分:1)
工作正常here
$(document).on('click','.clickable', function(){
window.location=$(this).find("a").attr("href");
return false;
});
我添加的唯一内容是指针悬停。
答案 3 :(得分:0)
你可以用CSS做到这一点。提供锚标记display: block;
。然后将ul
放入a
。
这是live demo。如果您将鼠标悬停在div
之上,则会看到它们都是可点击的。