Tee kogu Div klõpsatavaks - CSS-trikid

Anonim

Värskendage novembrit 2020: ma arvan, et parim võimalik tehnika on selle artikli 4. meetod. (Või mis iganes ümbris element) jääb semantiline ja kättesaadav, siis "klikitav" kogu piirkonnas. See ei riku tekstivalikut ja arvestab teiste "pesastatud" interaktiivsete elementidega.

See on täiesti kehtiv HTML:

 anything 

Ja pidage meeles, et saate linke luua display: block;, nii et kogu ristkülikukujuline ala muutub klõpsatavaks. Kuid kui seal on palju sisu, on see ligipääsetavuse jaoks täiesti kohutav, lugedes kogu seda sisu interaktiivse lingina.

Kui peate tingimata JavaScripti kasutama, on üks võimalus leida div-i seest link ja minna selle juurde, hrefkui div-il klõpsatakse. See on jQuery puhul:

$(".myBox").click(function() ( window.location = $(this).find("a").attr("href"); return false; ));

Otsib div-seest linki klassiga “myBox”. Suunab selle lingi väärtuse, kui klõpsatakse ükskõik kus div-s.

Viide HTML:

 blah blah blah. link 

Või võite määrata data-*atribuudi ja teha järgmist:

window.location = $(".myBox").data("location");