E il caso in cui i collegamenti vengono generati mentre la pagina viene utilizzata? Ciò si verifica frequentemente con i quadri front-end più complessi di oggi.
La soluzione corretta sarebbe probabilmente quella di mettere il listener di eventi click sul documento. Questo perché gli eventi sugli elementi si propagano ai loro genitori e perché un link viene effettivamente applicato dal genitore più in alto.
Questo funzionerà per tutti i collegamenti, siano essi caricati con la pagina, o generati dinamicamente sul front-end in qualsiasi momento.
function interceptClickEvent(e) {
var href;
var target = e.target || e.srcElement;
if (target.tagName === 'A') {
href = target.getAttribute('href');
//put your logic here...
if (true) {
//tell the browser not to respond to the link click
e.preventDefault();
}
}
}
//listen for link click events at the document level
if (document.addEventListener) {
document.addEventListener('click', interceptClickEvent);
} else if (document.attachEvent) {
document.attachEvent('onclick', interceptClickEvent);
}
Aggiornamento: Questo non è il modo migliore. Usando 'href =" javascript: void (0) "' è spesso meglio dato che non costringe la pagina a ricaricare. [altro qui] (http://stackoverflow.com/questions/134845/href-attribute-for-javascript-links-or-javascriptvoid0) – worldsayshi
Nota che entrambi questi modi impediscono agli utenti di utilizzare le azioni del tasto destro sui link (aperto in una nuova scheda, ecc.) –