Javascript - cum să dezactivați linkurile html

Am incercat totul, dar nu am lucrat pe Firefox (folosind 1.4.2 js):

Notă. Nu pot să nu înregistrez funcția de clic pentru eticheta de ancorare, deoarece este înregistrată dinamic. Și trebuie să afișez legătura în modul deconectat.







11 răspunsuri

Nu puteți dezactiva linkul (mod portabil). Puteți utiliza una dintre aceste metode (fiecare dintre ele având avantajele și dezavantajele sale).

Acest lucru ar trebui să fie corect (dar vedeți mai jos) pentru a face acest lucru atunci când majoritatea browserelor îl acceptă:

O altă opțiune este pentru IE 11+ - setați elementele de afișare pe blocul de referință sau inline-bloc:

Probabil că trebuie să definim o clasă CSS pentru evenimentele pointer: none. dar ce se întâmplă dacă re-utilizăm atributul dezactivat în locul clasei CSS? În mod strict vorbind, persoanele cu handicap nu sunt acceptate . dar browserele nu se vor plânge de atributele necunoscute. Utilizând atributul dezactivat. IE ignoră evenimentele indicatoare. dar va respecta atributul specific IE dezactivat; Alte browsere care sunt compatibile cu CSS vor ignora atributul necunoscut necunoscut și evenimentele indicatoare de onoare. Este mai ușor să scrie decât să explici:

Toate acestea, vă rugăm să rețineți că evenimentele pointer-dezactivează numai. pointer evenimente. Legăturile vor fi totuși accesibile prin tastatură. atunci va trebui să aplicați și una dintre celelalte metode descrise aici.

În combinație cu metoda CSS de mai sus, puteți utiliza tabulindex într-un mod nestandard pentru a împiedica focalizarea elementului:







Pentru a dezactiva linkurile, urmați acești pași:

Pentru a le activa din nou:

Dacă doriți în loc de .is ("[dezactivat]"). puteți utiliza .attr ( „dezactivat“)! = nedefinite (jQuery 1.6+ va reveni întotdeauna undefined. Atunci când atributul este setat), dar este () este mult mai clare (mulțumită lui Dave Stewart pentru aceasta recenzie). Vă rugăm să rețineți că aici folosesc atributul dezactivat un mod non-standard, dacă sunteți interesat, înlocuiți clasa atribut și înlocuiți .este ( „[dezactivat]“) pe .hasClass ( „dezactivat“) (adăugarea și eliminarea cu addClass () și) .

Rețineți că dacă href nu este șters, utilizatorul poate accesa manual această pagină.

Debifați atributul href. Cu acest cod, nu adăugați un handler de evenimente, dar schimbați singur linkul. Utilizați acest cod pentru a dezactiva linkurile:

Și asta pentru a le relua:

Pentru a le activa din nou:

Nu cred că există un motiv să preferăm această decizie în locul primei.

Stilul este chiar mai ușor, indiferent de decizia pe care o utilizați pentru a dezactiva linkul pe care l-am adăugat adăugând atributul dezactivat. astfel încât să puteți utiliza următoarea regulă CSS:

Dacă utilizați o clasă în locul unui atribut:

Nu uitați să includeți atributul aria-disabled = "true" împreună cu atributul dezactivat.

Există o altă modalitate posibilă și una care îmi place cel mai bine. Practic, aceasta este aceeași ca o casetă lightbox dezactivează o pagină întreagă, plasând o div și amestecând cu z-index. Iată fragmentele relevante din proiectul meu. Acest lucru funcționează în toate browserele.

Astfel, resizatorul găsește locațiile de legare (imagini doar săgeți) și plasează desalterul deasupra. Imaginea dezactivatorului este o pătrată gri semi-transparentă (schimbați lățimea / înălțimea desaburturilor în html pentru a se potrivi cu referința dvs.) pentru a arăta că este dezactivată. Amploarea vă permite să modificați dinamic dimensiunea paginii, iar dezadaptorii urmează acest exemplu în windowResizer (). Puteți găsi imaginile potrivite prin Google. Pentru simplitate, am postat css-ul corespunzător.

apoi, pe baza unor condiții







Articole similare

Trimiteți-le prietenilor: