gestione eventi con addEventListener,comportamento strano dell'handle

[blows83]

Salve a tutti ragazzi sono nuovo del forum(chiedo scusa in anticipo per eventuali errori)....
Ho creato una classe Menu in javascript che preso come parametro un valore "name"attribuito a piu tag crea un menu interattivo,quando istanzio il menu attribuisco dei valori a variabili private in più aggiungo gli handles all'evento "click" per ogni elemento del menu e fin qui tutto bene,la classe ha delle funzioni che mi permetto di cambiare i colori delle scritte dello sfondo ecc,il problema si presenta proprio qui perchè quando cambio colore a menu gia creato gli handle fanno riferimento sempre ai colori di default che vengono attribuiti al momento della creazione del menu,posto codice classe e vi ringrazio anticipatamente....

function Menu(vettoremenu,colore,coloreselezione) {
                
     var coloreprivato,coloreselezioneprivato,coloresfondoprivato,coloresfondoselezioneprivato;
     var elementocliccato=null;
    
    //code
    if (colore==null) {
        coloreprivato='black';
          
    }
    else coloreprivato=colore;
    
    if (coloreselezione==null) {
        coloreselezioneprivato='gold';
    }
    else coloreselezioneprivato=coloreselezione;
    
    coloresfondoprivato="transparent";
    coloresfondoselezioneprivato="transparent";
    this.lista=menu=document.getElementsByName(vettoremenu);
    
    
    this.getcolore=function(){return coloreprivato;};
    this.getcoloreselezione=function(){return coloreselezioneprivato;};
    this.setcolore=function(colore){this.coloreprivato=colore;};
    this.setcoloreselezione=function(coloreselezione){coloreselezioneprivato=coloreselezione;};
    this.setcoloresfondoselezione=function(coloreselezione){coloresfondoselezioneprivato=coloreselezione;};
    this.setcoloresfondo=function(coloresfondo){coloresfondoprivato=coloresfondo;
                                                for(i=0;i<menu.length;i++){
                                                menu[i].setAttribute("onMouseEnter","this.style.backgroundColor="+'\''+coloresfondo+'\''+";");
                                                menu[i].setAttribute("onMouseLeave","this.style.backgroundColor='transparent';");
                                                }};
    this.getcoloresfondo=function(){return coloresfondoprivato;};
    this.getcoloresfondoselezione=function(){return coloresfondoselezioneprivato;};
    
    cambiacoloremenu=function(precedente){
         if(elementocliccato==null){ 
              if (typeof(precedente)=="object") {
                 precedente.style.color=coloreselezioneprivato;
                 precedente.setAttribute("onMouseLeave","this.style.backgroundColor="+'\''+coloresfondoselezioneprivato+'\''+";");
                 precedente.setAttribute("onMouseEnter","this.style.backgroundColor="+'\''+coloresfondoselezioneprivato+'\''+";");
                 elementocliccato=precedente;
               
              }
             else{ 
                 
                  return null;
            }
           }
           else{
            alert(coloreprivato);
           precedente.style.color=coloreselezioneprivato;
           elementocliccato.style.color=coloreprivato;
           precedente.setAttribute("onMouseLeave","this.style.backgroundColor="+'\''+coloresfondoselezioneprivato+'\''+";");
           precedente.setAttribute("onMouseEnter","this.style.backgroundColor="+'\''+coloresfondoselezioneprivato+'\''+";");
           elementocliccato.setAttribute("onMouseEnter","this.style.backgroundColor="+'\''+coloresfondoprivato+'\''+";")
           elementocliccato.setAttribute("onMouseLeave","this.style.backgroundColor='transparent';");
           elementocliccato.style.backgroundColor="transparent";
           elementocliccato=precedente;
           }
           };
    
    
    
  
   
    for(var i=0;i<menu.length;i++){
             if(menu[i].tagName=='A'||menu[i].tagName=='a'){
              menu[i].setAttribute("href","javascript: void(0)");
              }      
        menu[i].addEventListener("click",function prova(event){cambiacoloremenu(this);});
        menu[i].setAttribute("color",coloreprivato);
        menu[i].setAttribute("onMouseLeave","this.style.backgroundColor='transparent';");
    }


 
 
this.loadancore=function(vettorecollegamenti){  
       elementi=document.getElementsByName(vettorecollegamenti);
         
       if(elementi.length!=menu.length){
              elert("errore nel collegamento menu");
              return -1;
              }
              
    else{
      for(i=0;i<menu.length;i++){
          
         pro=menu[i].getAttribute("onclick"); 
         //pro+="window.scrollTo(0,"+elementi[i].offsetTop+");";
      
         menu[i].addEventListener("click",function(event){sposta(elementi[i].id);});
         //menu[i].setAttribute("onclick",pro);
         }
         return 0;
       }     
              
     };
  
}

 

[blows83]

ho notato che il problema si accentua se istanzio altri oggetti dalla classe menù,mi sta venendo in mente che javascript non sia adattisimo per la programmazione ad oggetti ma se penso a jquery o ad ajax torno sulla terra e credo che il problema sia io

 

[blows83]

problema risolto...ci sono alcune variabili nella classe che non essendo dichiarate con la parola chiave var vengono interpretate globali e quindi creando un nuovo oggetto menu andavano a sovrascriversi