Colorare i button con una function

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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');"/>
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
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?
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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 ....
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
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++;
        } 
    }
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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...
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
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.
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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.
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
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.
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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"
......
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
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.
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
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... :(
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
Livorno
Ciao, :)

buon proseguimento con il progetto :fonzie:


Valeria.