Colorare i button con una function

Discussione in 'Javascript' iniziata da cavaliere123, 17 Ottobre 2012.

  1. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    si,infatti
    controlla se gli id sono messi nel modo giusto
     
  2. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    ho cambiato anche nome dell'id per evitare conflitti ma sempre lo stesso... per tabelle pari funziona, per tabelle dispari non inverte il colore.... assurdooooooo....
    Posto ad esempio due button di due tabelle, la prima e la seconda.... che cambia ?????

    Ultimo button della prima tabella :
    HTML:
    <INPUT id ="forum15" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/>
    
    primo button della seconda tabella :

    HTML:
    <INPUT id ="forum16" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img16');"/>
    
     
  3. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    Se la prima tabella inizia con il blu e ha le celle dispari è normale che la seconda inizi con il rosso

    è questo che intendi?
     
  4. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Allora ho per adesso sette tabelle ed in ogni tabella ho 15 celle e quindi 15 td, adesso ho messo in ogni cella il tasto button visionato in precedenza e vorrei che se la cella è rossa il tasto è blu e viceversa...
    La funzione colora celle funziona benissimo e mi inverte i colori delle celle man mano, come visto in discussioni precedenti... adesso ho messo la funzione colora tasto per invertire i colori come detto prima...
    Succede che nella prima tabella i colori del button non si inverte e tiene lo stesso colore della cella, invece nella tabella seconda il colore del tasto si inverte....
    me sa che ho sbagliato a mettere i codici che partono da 1, vanno in conflitto con il vettore dei td che invece parte da 0 ....

    HTML:
     function coloracelle() { 
                   
                for(var g = 1; g < 8; g++) {
                var tabella = document.getElementById("tabellas"+g);
                                                     
     var td = tabella.getElementsByTagName('td');
        var count_td = td.length;
    for(var i = 0; i < count_td; i++) {
    if(i%2==0) {
    td[i].style.backgroundColor = "TOMATO";
    }else{
    td[i].style.backgroundColor = "DODGERBLUE"; }
    }
    } }
    
                 function coloratasto() {
    
                 for(var d = 1; d <106; d++) {
                   var tastost = document.getElementById("forum"+d); 
    
    
                            if(d%2==0) {    
                                   tastost.style.backgroundColor  = "DODGERBLUE"; 
                             }else{
                                   tastost.style.backgroundColor  = "TOMATO"; }
                                   
                                           } }
    
    
    ecco le due funzioni ....
     
  5. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Me sa che forse è meglio che riassesto tutto il codice, facendo partire tutti gli indici da " 0" :)
     
  6. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    e se provi cosi?
    Codice:
    function coloracelle() { 
            var countButton = 1;
            
            for(var g = 1; g < 8; g++) {
                var tabella = document.getElementById("tabellas"+g);
                                                     
                var td = tabella.getElementsByTagName('td');
                var count_td = td.length;
                for(var i = 0; i < count_td; i++) {
                    if(i%2==0) {
                        td[i].style.backgroundColor = "TOMATO";
                        document.getElementById("buttono"+countButton).style.backgroundColor  = "DODGERBLUE";
                    }else{
                        td[i].style.backgroundColor = "DODGERBLUE"; 
                        document.getElementById("buttono"+countButton).style.backgroundColor  = "TOMATO";
                    }
                }
                countButton++;
            } 
        }
     
  7. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Provato ma purtroppo i button non si colorano proprio... :(
     
  8. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Mi sono ricordato di fare la sostituzione di buttono con forum ....
    ma i primi 4 della prima tabella vanno bene... poi diventano tutti senza colore...
     
  9. Vale2

    Vale2 Utente Attivo

    Registrato:
    28 Maggio 2006
    Messaggi:
    446
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Occupazione:
    Ex Studente - Cerca collaborazione per Asp e Asp.N
    Località:
    Livorno
    Ciao,

    Codice:
    <table style="text-align: left; width: 100%;" border="1"
     cellpadding="2" cellspacing="2" id="tabellas">
      <tbody> 
      <tr> 
        <td align="center"><INPUT id ="forum0" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum1" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum2" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
      </tr>
      <tr> 
        <td align="center"><INPUT id ="forum3" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum4" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum5" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
      </tr>
      <tr>
        <td align="center"><INPUT id ="forum6" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum7" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum8" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
      </tr>
      <tr>
        <td align="center"><INPUT id ="forum9" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum10" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
        <td align="center"><INPUT id ="forum11" class="button1" TYPE="button" VALUE="Chiuda Immagine" onclick="piccola('img15');"/></td>
      </tr>
    </table>
    <table width="75%" border="1">
    
    
    <script type="text/javascript">
    	var a = document.getElementsByTagName('TD');
            var n = document.getElementsByTagName('TD').length;
                for(var i = 0; i < n; i++) {
    	    var tastost = document.getElementById("forum"+i);
    	         if(i%2==0) {
                a[i].style.backgroundColor = "TOMATO";
                tastost.style.backgroundColor  = "DODGERBLUE"; 
    		    }else{
               a[i].style.backgroundColor = "DODGERBLUE";
              tastost.style.backgroundColor  = "TOMATO";
    	 }
      }
    </script>
    Per una tabella, metti il codice per tabella+variabile


    Valeria.
     
  10. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Ho fatto cosi.... prendendo i suggerimenti di entrambi e funziona....
    In questo caso... la funzione se ne frega di quante tabelle c'è ne sono.... conta solo tutti i " td " che trova a quanto ho capito e poi per non cambiare l'id ai circa 106 button ho imposto k = i+1 e funziona...

    HTML:
    
                         function coloracelle() { 
    
                           var a = document.getElementsByTagName('TD');
            var n = document.getElementsByTagName('TD').length;
                for(var i = 0; i < n; i++) {  var k = i+1 ;
    	    var tastost = document.getElementById("forum"+k);
    	         if(i%2==0) {
                a[i].style.backgroundColor = "TOMATO";
                tastost.style.backgroundColor  = "DODGERBLUE"; 
    		    }else{
               a[i].style.backgroundColor = "DODGERBLUE";
              tastost.style.backgroundColor  = "TOMATO";
    	           }
                     } }
    
    
    Spero di essere stato chiaro e grazie davvero... :)
    Domenico.
     
  11. Vale2

    Vale2 Utente Attivo

    Registrato:
    28 Maggio 2006
    Messaggi:
    446
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Occupazione:
    Ex Studente - Cerca collaborazione per Asp e Asp.N
    Località:
    Livorno
    Ciao,

    hai fatto bene a ridurre il codice al minimo indispensabile, se hai anche 40 tabelle ma tutte uguali,

    tutti i button si chiamano forum?

    Valeria.
     
  12. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Salve Valeria e scusa se non ti ho salutato prima... si i button sono tutti quanti uguali e si differenziano solo chiaramente per id diverso....
    id = "forum1"
    id="forum2"
    ......
     
  13. Vale2

    Vale2 Utente Attivo

    Registrato:
    28 Maggio 2006
    Messaggi:
    446
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Occupazione:
    Ex Studente - Cerca collaborazione per Asp e Asp.N
    Località:
    Livorno
    Ciao,

    se parti da 0 per id non ti serve var k = i+1

    e

    document.getElementById("forum"+k);

    bastava come avevo scritto io.

    PS: puoi far partire un ciclo da 1 2 o 3 ma il length considera anche lo [0] funziona uguale perché limiti il ciclo in base ai td, ma in termine di programmazione non è del tutto corretto.




    Valeria.
     
  14. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Certo Valeria hai perfettamente ragione, ma purtroppo succedeva che al td[0] non corrispondeva il forum[0] ( che non avevo proprio inserito ), ma forum[1] e quindi il caos.... avrei dovuto cambiare l'elenco dei forum facendolo partire da id = "forum0", ma avendo associato ad esso anche altre funzioni che con partono con i for da 1, avrei dovuto cambiare tutto...
    Non chiedermi il perchè di questo... non mi ricordo neanche più... il mio problema a parte la poca conoscenza della sintassi è principalmente la mole dei dati ogni volta... e ti assicuro che diventa snervante e creo degli errori iniziali inutili... :(
     
  15. Vale2

    Vale2 Utente Attivo

    Registrato:
    28 Maggio 2006
    Messaggi:
    446
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Occupazione:
    Ex Studente - Cerca collaborazione per Asp e Asp.N
    Località:
    Livorno
    Ciao, :)

    buon proseguimento con il progetto :fonzie:


    Valeria.
     
  16. cavaliere123

    cavaliere123 Utente Attivo

    Registrato:
    31 Luglio 2012
    Messaggi:
    415
    Mi Piace Ricevuti:
    0
    Punteggio:
    0
    Buon proseguimento anche a te e grazie sempre per l'accortenza che mi mostrate.. :)
     
Sto caricando...

Condividi questa Pagina