Colorare i button con una function

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
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
416
0
16
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
416
0
16
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
416
0
16
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
416
0
16
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
416
0
16
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... :(
 
Discussioni simili
Autore Titolo Forum Risposte Data
G Colorare menu select attraverso ricerca php PHP 0
B [Photoshop] Colorare tracciato Photoshop 1
C Colorare righe tabella tramite condizione Java 5
M colorare il tasto del menu all'apertura del div HTML e CSS 19
G Non riesco a colorare una campitura con lo strumento penna Photoshop 1
R Colorare parzialmente una figura con i css HTML e CSS 6
L colorare variabile ricerca file testo PHP 2
V Colorare cella HTML e CSS 2
Shyson Colorare link al click jQuery 10
G Usare clone per colorare ma senza sbavare, come posso procedere? Photoshop 2
Web Designer Colorare la Legenda Gruppi in MyBB CMS (Content Management System) 0
L Colorare immagine usando colori RGB Photoshop 18
C Colorare nick in base al sesso dell utente PHP 4
I Colorare records tabella Database 0
Dragon Javascript: colorare cella con link Javascript 0
A Colorare le barrette di scorrimento HTML e CSS 4
Eugene CSS per colorare barre di scorrimento - vietato? HTML e CSS 3
C colorare il border di un immagine HTML e CSS 5
H Colorare le barre di scorrimento HTML e CSS 20
diodo colorare le scrollbar HTML e CSS 1
M come colorare i recordset con asp Classic ASP 1
N Ma come cavolo faccio a colorare la barra di scorrimento.... HTML e CSS 9
G Associare un button ad una strnga PHP 9
Alex_70 Button non funziona nella form PHP 2
felino Radio button e Bootstrap: modificare il colore di default! HTML e CSS 1
M Problema con visibility e radio button Javascript 2
L Mancata visualizzazione di icone su button PHP 0
O [PHP] Problema Button in form PHP 1
A [PHP] Problema Button in form PHP 6
F Check radio button jQuery 1
S Sostituire link con button. PHP 1
Benix89 Come salvare radio button selezionato Magento 1
Benix89 Salvare radio button selezionato PHP 2
V Cambiare colore ad un button HTML e CSS 3
V Button in javascript Ajax 2
napuleone Oggetto " button " js non mi funziona Javascript 3
felino [C#] Click di un Button tramite il tasto Enter .NET Framework 2
A Caricare una pagina jsp in un div alla pressione di un button Javascript 1
A visualizzare testo a seguito di check radio button Javascript 1
felino [Supersized] Button relazionato alla slide corrente Javascript 1
C Salvare il click su di un Button Sviluppo app per Android 9
F Integrazione con Spotify Play Button Javascript 0
N Radio Button PHP 1
L Comportamento anomalo dei button type submit PHP 1
T selezionare un campo da un db con radio button PHP 0
G Funzione hide/show button Javascript 5
Z centrare verticalmente il testo di un button HTML e CSS 1
F radio button remove() jquery jQuery 1
F Like button Facebook PHP 0
D recupero valore radio button PHP 1

Discussioni simili