Annullare l'azione predefinita in JavaScript
A volte con JavaScript è necessario annullare l'azione predefinita di un tag. Ad esempio, cliccando su un link per annullare la navigazione verso quel link. Di solito questo è necessario quando utilizziamo questo link semplicemente per eseguire del codice. In questo caso il fatto che cliccando sul link avvenga la navigazione verso di esso, non è affatto ciò di cui abbiamo bisogno.
L'annullamento dell'azione predefinita viene effettuato
utilizzando l'oggetto Event. Per questo
esiste un metodo speciale preventDefault(),
che dovrebbe essere chiamato in qualsiasi punto del gestore
eventi.
Proviamo nella pratica. Supponiamo di avere questo link:
<a href="/" id="elem">link</a>
Facciamo in modo che cliccando sul link non avvenga il passaggio a un'altra pagina:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function(event) {
event.preventDefault();
console.log('Non puoi navigare su questo link!');
});
Sono dati dei link. Fate in modo che al click su un link le venga aggiunto in fondo il suo href, e che la navigazione sul link non avvenga.
Sono dati due input, un paragrafo e un link. Si supponga che negli input vengano inseriti dei numeri. Fate in modo che cliccando sul link nel paragrafo venga scritta la somma dei numeri inseriti.