Mise à jour de novembre 2020: je pense que la meilleure technique possible pour cela est la méthode 4 de cet article. L' élément (ou n'importe quel élément wrapper) reste sémantique et accessible, tout en étant «cliquable» sur toute la zone. Il ne rompt pas la sélection de texte et respecte les autres éléments interactifs «imbriqués».
C'est du HTML parfaitement valide:
anything Et n'oubliez pas que vous pouvez créer des liens display: block;, de sorte que toute la zone rectangulaire devient «cliquable». Mais, s'il y a une tonne de contenu là-dedans, c'est absolument horrible pour l'accessibilité, lire tout ce contenu comme lien interactif.
Si vous devez absolument utiliser JavaScript, une façon est de trouver un lien à l'intérieur du div et d'y accéder hreflorsque le div est cliqué. C'est avec jQuery:
$(".myBox").click(function() ( window.location = $(this).find("a").attr("href"); return false; ));Recherche un lien à l'intérieur de div avec la classe «myBox». Redirige vers cette valeur de liens lorsque l'utilisateur clique n'importe où dans div.
HTML de référence:
blah blah blah. link Ou, vous pouvez définir un data-*attribut sur le et faire comme:
window.location = $(".myBox").data("location");