inserire "a volo" un evento in un tag

*pragma · 18-03-2009, 13:20

Salve, come da titolo.
per una questione di accessibilità non voglio inserire javascript nel codice html.
p.es.
<input type="checkbox" id="ch" val="ecc" onclick="funzione1()" />
non dovrebbe andare onclick=ecc...

Ecco chiedo quale può essere lo script tra gli <head> per poter inserire quel gestore a volo o al caricamento della pagina.
grazie

**artorius** · 18-03-2009, 14:04

semplice, si usa la notazione DOM1:

codice:

//Funzione lanciata al caricamento della pagina
window.onload = function(){
   document.getElementById('ch').onclick = funzione1; //qui mi raccomando di NON scrivere () alla fine e di NON mettere gli " o '
}

Ora cliccando sul link con id="ch" si attiva la funzione.

A mio avviso è molto meglio della notazione DOM0, soprattutto perché all'interno della funzione associata (nel tuo caso di funzione1) chiamando this ottieni il link stesso, quindi se volessi cambiargli il testo mi basterebbe fare:

codice:

var funzione1 = function(){
   this.innerHTML = "Sono stato premuto!";
}

*pragma · 20-03-2009, 14:46

Grazie per la risposta molto chiara.
Per la seconda soluzione (la notazione DOMO) non ho capito come applicarla a questa funzione che al click su un radio rende attiva una textarea che di codice ha l'attributo (se non è attributo correggimi) disabled. In questo caso faccio riferimento non all'id, ma al type dell'input.

codice:

                    function rendiAttivo()    {
  var inpt = document.getElementsByTagName('input');
      for(var i = 0; i < inpt.length; i++) {
          if(inpt[i].type == "radio" && inpt[i].checked)  {	  
              document.getElementsByTagName('textarea')[0].disabled = false ;
	      break;
	}
          }

Vorrei provarci io ad applicare il tuo suggerimento, ma non so proprio da dove cominciare.
Grazie

**artorius** · 20-03-2009, 15:34

Aspetta la vuoi su di un checkbox o un radio?

Comunque, non ti serve fare tutta la trafila:

codice:

<input type="radio" name="myRadio" value="On" id="MyRadio" />
<textarea name="myArea" id="MyArea" disabled="true">
</textarea>

Poi fai una funzione:

codice:

var rendiAttivo = function(){
   document.getElementById("MyArea").disabled = !this.checked;
}

window.onload = function(){
  document.getElementById("MyRadio").onclick = rendiAttivo;
}

In ogni caso, la notazione DOM0 è quando metti la funzione direttamente nel Tag:

<input type="button" onclick="doSomething()" />

mentre la DOM1 è quando assegni la funzione nel codice JS:

window.onload = DoIt;

Dove DoIt è una funzione.

Discussione: inserire "a volo" un evento in un tag

Strumenti discussione

Ricerca discussione

Visualizza

inserire "a volo" un gestore d'evento in un tag

Permessi di invio