Opdatering november 2020: Jeg tror, at den bedst mulige teknik til dette er metode 4 i denne artikel. Den (eller hvad wrapper element) forbliver semantisk og tilgængelig, og samtidig være ”klikbare” over hele området. Det bryder ikke tekstvalg og respekterer andre "indlejrede" interaktive elementer.
Dette er perfekt gyldig HTML:
anything Og husk at du kan oprette links display: block;, så hele det rektangulære område bliver "klikbart". Men hvis der er masser af indhold derinde, er det helt forfærdeligt for tilgængelighed, når man læser alt det indhold som det interaktive link.
Hvis du absolut har brug for JavaScript, er en måde at finde et link inde i div og gå til dets, hrefnår der klikkes på div. Dette er med jQuery:
$(".myBox").click(function() ( window.location = $(this).find("a").attr("href"); return false; ));Ser efter et link inde i div med klasse "myBox". Omdirigerer til den linkværdi, når der klikkes på et vilkårligt sted i div.
Reference HTML:
blah blah blah. link Eller du kan indstille en data-*attribut på og gøre som:
window.location = $(".myBox").data("location");