comment un rendre un élément HTML (DIV) cliquable

recette(s) semblable(s): javascript | jquery | snippet

Un élément de type texte ne peut pas contenir un type block. Si l'on veut respecter les standards (W3C), on ne peut donc pas mettre un tag DIV dans un tag A pour transformer celui-ci en un lien. le code suivant permet de transformer un div grace au lien qu'il contient sans enfreindre la norme.  


//un peu de jquery
<script src="ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
//et hop !
<script type="text/javascript" >
$(function() { 
$('div.go').each(function() {
var link = $(this).find('[href]').first().attr('href');
if ( link ) {
$(this).click(function () {
window.location = link;
});
}
});
});
</script>

<div style="border:1px #ccc solid;padding:20px;">
<div class="go" style="border:4px #000 solid;padding:20px;margin:10px;">
cliquez sur le div !
<a href="http://proot.fr/">ou le lien</a>
</div>
<div class="go" style="border:4px #000 solid;padding:20px;margin:10px;">
cliquez sur le div !
<a href="http://proot.fr/">ou le lien</a>
</div>
</div>