使Div成為鏈接

Question

我有兩個div，我想點擊一下。 每個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> 

Answer 1

將DIV放入錨點在HTML5中有效，並且與其他DOCTYPE向后兼容。

<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>

Answer 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;
});

Answer 3

在這里工作正常

$(document).on('click','.clickable', function(){
    window.location=$(this).find("a").attr("href");
    return false;

});

我添加的唯一一件事是懸停指針。

Answer 4

您可以使用CSS進行此操作。 display: block;錨標簽display: block; 。 然后將ul放入a 。

這是一個現場演示 。 如果將鼠標懸停在任一div ，則會看到它們都是可單擊的。