Aktualizace listopad 2020: Myslím, že nejlepší možnou technikou je metoda 4 v tomto článku. (Nebo cokoliv wrapper element) zůstává sémantický a přístupná, i když je „klikací“ po celé ploše. Neruší výběr textu a respektuje ostatní „vnořené“ interaktivní prvky.
Toto je naprosto platný HTML:
anything Pamatujte, že můžete vytvářet odkazy display: block;, takže celá obdélníková oblast bude „klikatelná“. Ale pokud je tam spousta obsahu, je to naprosto hrozné pro přístupnost, číst celý tento obsah jako interaktivní odkaz.
Pokud nezbytně potřebujete použít JavaScript, jedním ze způsobů je najít odkaz uvnitř div a přejít na jeho, hrefkdyž na div kliknete. Toto je s jQuery:
$(".myBox").click(function() ( window.location = $(this).find("a").attr("href"); return false; ));Hledá odkaz uvnitř div s třídou „myBox“. Přesměruje na tuto hodnotu odkazu, když kliknete kdekoli na div.
Referenční HTML:
blah blah blah. link Nebo můžete nastavit data-*atribut na a dělat jako:
window.location = $(".myBox").data("location");