addEventListener e attachEvent

[T'Pol]

Anche se js non è materia mia, mi sto divertendo a sperimentare un po'.
Ad esempio sto cercando di capire come funziona la registrazione di un evento.
Ora... questo è stato un dei miei punti di riferimento http://www.quirksmode.org/js/events_advanced.html
ma non mi è chiara una cosa, probabilmente anche a causa di qualche difficoltà con l'inglese: esattamente cosa sono e cosa fanno startDragDrop e spyOnUser nell'esempio:
element.addEventListener('click',startDragDrop,fal se)
element.addEventListener('click',spyOnUser,false)

Io ad esempio, ho provato a registrare una classe (css) diversa al click, sia per ie che per gli altri utilizzando quindi entrambe i metodi in oggetto. In uno dei due casi così:

element.addEventListener('click',function () {
this.className="test2"
},false)

Ora, quello che succede è che il codice non da errore e fa quello che deve fare ma se clicco due volte! Perchè? è come se sentisse l'evento al secondo click sia con IE che con gli altri....

Se quanluno mi può spiegare in italiano gliene sono molto grata (mi è venuto il mal di testa a leggere in inglese!)

[Xinod]

questi startDragDrop e spyOnUser sono generiche funzioni che si suppone tu abbia definito altrove

function startDragDrop(){...}
function spyOnUser(){...}

tu invece al click fai eseguire una funzione anonima, quel
function () {this.className="test2"}
ed e' ugualmente corretto

non ha ragione di presentarsi il problema di dover cliccare due volte
quindi prova a postare un esempio piu' articolato per individuare cosa determini il malfunzionamento

[T'Pol]

ok allora, posto solo per Mozilla ecc tanto anche se cambia leggermente, la cosa è simile anche per IE.

Questo è quello che faccio:

//Questa funzione viene richiamata dall'evento onclick
function changeClass(mioBt) {
	var element = getElmById(mioBt)
	if (element.className == "noactive"){
		registerClass(element, 'active')
	}else{
		registerClass(element, 'noactive')
	}
} 

//Ricavo l'id dell'elemento
function getElmById(mioBt){ 
  var element = null; 
  if (document.getElementById)
  element = document.getElementById(mioBt);
  return element; 
}

//Registro il cambio di classe css
function registerClass(element, style){ 
	if (element.addEventListener) {	
		element.className=style
		element.style.cursor = 'pointer'
		element.addEventListener('click',function () {
			this.className=style
		},false)
	}
}

è meglio quando viene segnalato un errore che quando funziona in modo anomalo e non ci sono errori!!!

[Xinod]

cosa dovrebbe fare questo codice?

se commenti element.className=style non associa la classe al click?

[T'Pol]

Ho una serie di bottoni (classe css noactive), quando li clicco li passo su active e mantengo lo stato su quella classe fino al click successivo.

la funzione changeClass la richiamo all'onclick, mi ricavo l'id dell'elemento e se la sua classe attuale è active lo passo su noactive con la funzione registerClass, alla quale passo l'id e il nome della classe. Se commento element.className=style si comporta esattamente nello stesso modo, cioè devo fare 2 click per vedere il risultato.

[Xinod]

quando dici "la funzione changeClass la richiamo all'onclick" intendi dire che hai un
<input type="button" id="blabla" onclick="changeClass(this.id)" ... />
o simile, direttamente nel markup?
in tal caso tu accodi a quell' onclick quello che vai ad aggiungere via addEventListener
e ti puoi accorgere delle conseguenze dei vari passaggi con un paio di alert

<input type="button" id="blabla" onclick="changeClass(this.id);alert('onclick nel markup')" ... />

function registerClass(element, style){
alert('onclick aggiunto via addEventListener');
...
}

[T'Pol]

si esatto intendo dire esattamente quello.
Grazie per avermi fatto capire il problema. Domani proverò a risolverlo se mi impiccherò ulteriormente te lo farò sapere!!!!