Controllo sul colore.

[pictor]

Scusate ho un semplice problemino

Ho una funzione che dovrebbe invertirmi il colore di un div.

if (document.getElementById(obj).style.backgroundColor=='#000000')
     document.getElementById(obj).style.backgroundColor=='#FFFFFF'

Il fatto è che anche se il colore è quello non entra mai dentro all'IF!

Se provo a stamparlo vedo che me lo stampa in formato rgb(0,0,0).
Il colore restituito è nero e quindi dovrebbe entrare dentro all' IF.

Mi viene il dubbio che '#000000' non sia il modo giusto di indicargli il colore (magari lo vede solo in formato rgb()? )

Mi date una manina?

Grazie

[seed_squall_it]

Ci sono errori nel codice.

document.getElementById(obj).style.backgroundColor =='#FFFFFF'

Questa riga dovrebbe impostare il colore, non verificarlo. Quindi quel "==" dovrebbe essere un "=".

Poi, se non usi le parentesi graffe per il blocco if (perché hai una sola riga che viene eseguita se la condizione è vera), dovresti scriverla sulla stessa riga dell'if, non a capo.

Infine, il colore è scritto fisicamente nel tag del tuo box tramite un attributo style o viene impostato tramite CSS esterno? Perché potrebbe darsi che il browser non riesca a recuperarlo se non lo trova scritto fisicamente nel tag.

Per la notazione con l'operatore rgb(), non esiste un modo sbagliato di indicare un colore. Puoi indicarlo a piacimento con la notazione esadecimale (#FFFFFF), con l'operatore rgb() (rgb(255,255,255)), con il nome (white) oppure con la forma abbreviata per la notazione esadecimale, se il colore è websafe (#FFF).

[pictor]

Grazie delle risposta

Originariamente inviato da seed_squall_it
Ci sono errori nel codice.

document.getElementById(obj).style.backgroundColor =='#FFFFFF'

Questa riga dovrebbe impostare il colore, non verificarlo. Quindi quel "==" dovrebbe essere un "=".

Sì qua avevo sbagliato ma non sta qui l'errore. Anche con l'assegnamento non funziona ugualmente

Poi, se non usi le parentesi graffe per il blocco if (perché hai una sola riga che viene eseguita se la condizione è vera), dovresti scriverla sulla stessa riga dell'if, non a capo.

No, l'if è un blocco... è che ho scritto solamente un pezzettino di codice

Infine, il colore è scritto fisicamente nel tag del tuo box tramite un attributo style o viene impostato tramite CSS esterno? Perché potrebbe darsi che il browser non riesca a recuperarlo se non lo trova scritto fisicamente nel tag.

Il colore è impostato direttamente nel tag.
E' strano perchè in IE funziona.... su Firefox invece no.... ma non dà errori javascript

Per la notazione con l'operatore rgb(), non esiste un modo sbagliato di indicare un colore. Puoi indicarlo a piacimento con la notazione esadecimale (#FFFFFF), con l'operatore rgb() (rgb(255,255,255)), con il nome (white) oppure con la forma abbreviata per la notazione esadecimale, se il colore è websafe (#FFF).

Ecco appunto, immaginavo non fosse quello il problema....

Comunque per avere del codice in più:

				if (document.getElementById(obj).style.backgroundColor=='#000000')
				{
					//deseleziono
				document.getElementById(obj).style.backgroundColor='#FFFFFF';
	
				}
				else
				{
					//seleziono
				document.getElementById(obj).style.backgroundColor='#000000';

				}

La pagina si carica con il colore nero eppure non entra nell'IF!
Anche nel caso io faccia

document.getElementById(obj).style.backgroundColor='#000000';

giusto prima dell' IF.

Non ha senso!

[seed_squall_it]

Assurdo! Firefox legge il colore usando l'operatore rgb() (verificato con un alert all'onload), ma non riesce ad applicare il colore né con notazione esadecimale, né con quella rgb! Ho provato ad applicarlo sia in automatico all'onload che manualmente al clic su un link...niente da fare! Il tutto verificato su Firefox 1.5.0.6. Mi sa che questo è un bel bug! Con IE funziona in tutti i modi, anche indicando il colore con notazione rgb.

[pictor]

Ecco, infatti mi pareva....

Stessa versione di Firefox.... sarà quello?
Nelle altre versioni funziona?

Cioè non ho capito proprio non è possibile assegnare il colore tramite JS?

Come posso risolvere?

[seed_squall_it]

Purtroppo non ho altre versioni a disposizione...cmq è davvero assurdo. Qualunque browser deve riuscire a modificare il colore di sfondo di un elemento accedendo alla proprietà style e reimpostando il valore della proprietà backgroundColor. Mi dispiace, ma le ho provate tutte anche io...non c'è verso di far cambiare colore a Firefox! Sta a vedere che ora Firefox diventa peggio di IE in pochi mesi...

[SoulHome]

a me
document.getElementById(obj).style.backgroundColor ='#000000'
funziona...(ho ff 1.5.0.6)
i problema penso sia nell'if....backgroundColor non si può usare con gli operatori di confronto...ma solo con quelli di assegnamento...

[seed_squall_it]

OK, ma è cmq assurdo...se io voglio modificare il colore di sfondo di un elemento, come potrei fare allora? Anche perché cmq i valori delle proprietà CSS sono stringhe, quindi si tratta di un banalissimo confrontro tra stringhe. In questo, trovo che IE sia decisamente migliore. A questo punto allora bisognerebbe assegnare una classe con il colore di sfondo e modificare la proprietà className solamente per cambiare colore di sfondo ad un elemento...bella fregatura!

[Mega69]

A me pare una buona soluzione, ma il fatto che Mozilla non riesca a farlo è in effetti assurdo.
Avete gia mandato l'errore a Bugzilla?

[Shagrat]

Per me non è un bug, semplicemente IE restituisce la proprietà backgroundColor nel formato #xxxxxx invece firefox nel formato rgb, e ovviamente confrontando la stringa rgb(x, x, x) con #xxxxxx il confronto ritorna false.

<html>
  <head>
    <script language="javascript">
      
      function Dec2Hex (Dec) {
        var hexChars = "0123456789ABCDEF";
        var a = Dec % 16;
        var b = (Dec - a)/16;
        hex = "" + hexChars.charAt(b) + hexChars.charAt(a);
        return hex;
      }
    
      function rgbToHex(rgb){
        if (rgb.indexOf("#") == 0){
          return rgb;
        }

        var str = rgb.replace(/rgb\(/,"").replace(/\)/,"");
        var arr = str.split(", ");
        
        var r = arr[0];
        var g = arr[1];
        var b = arr[2];
        
        return "#" + Dec2Hex(r) + Dec2Hex(g) + Dec2Hex(b);
      }
    
      function swappa(obj){
        var colore = document.getElementById(obj).style.backgroundColor;

        if (rgbToHex(colore) == "#000000"){
          document.getElementById(obj).style.backgroundColor = "#FFFFFF";
          document.getElementById(obj).style.color = "#000000";
        }
        else{
          document.getElementById(obj).style.backgroundColor = "#000000";
          document.getElementById(obj).style.color = "#FFFFFF";
        }  
      }
      
    </script>
  </head>
  <body>
    <div id="test" style="background-color:#000000;color:#FFFFFF">ECCO IL DIV</div>
    <input type="button" value="xx" onclick="swappa('test')">
  </body>
</html>

così funziona con entrambi i browser