Salve a tutti,
premetto che sono alle primissime armi con javascript. Mi sto esercitando con i gestori di eventi e a tale proposito ho scritto al volo una pagina html contenente semplicemente un intestazione e un paragrafo nel quale è presente un link. Al click dell'utente voglio che appaia una finestra che avverte che l'utente sta lasciando la pagina. Niente di più semplice.
Il codice html è il seguente:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Esercizi con gli event handler e gli event listener</title>
<script type="text/javascript" src="event.js"></script>
</head>
<body>
<header>
<h1>Creo un gestore di eventi per il link sottostante</h1>
</header>
<div>
Questo link vi indirizza alla pagina
<a id="linko" href="/eserc_js/page1.html">page1.html
</a>
</p>
</div>
</body>
</html>
Come è evidente, a questa pagina ho associato il file event.js da me creato che contiene il seguente codice:
var PageLink =
{
clickHandler: function()
{
alert("stai per lasciare la pagina");
}
};
var link = document.getElementById("linko");
link.onclick = PageLink.clickHandler;
in linea teorica dovrebbe funzionare, non credo ci siano errori nello script né nel codice html, anzi ne sono certo. Il fatto però è che il browser non attribuisce alla variabile "link" l'elemento "a" che ha come id "linko", quando invece dovrebbe!!!
Infatti se scrivo
alert(link);
il browser mi restituisce "null", quando invece dovrebbe restituirmi "http//localhost/eserc_js/page1.html".
Ancora, se scrivo
alert(link.nodeName);
di nuovo "null", invece che "a".
La cosa sconcertante è che se scrivo il codice dalla console di Google Chrome, non solo no mi da alcun errore nello script, ma funziona tutto perfettamente! Il browser associa senza problemi la variabile link al tag a del codice html!!! perché????? qualcuno sa dirmelo?
grazie.
Rispondi quotando
