Il linguaggio JavaScript
 

n problema

manila22@interfree.it 12 Giu 2015 15:05
Ho un problema.

C'è una tabella.
Ho una funzione js che fa cambiare colore ad un td quando clicco su un altro td
La funzione è scritta così:

<script>

function cambia(obj) {

if(document.getElementById(obj).style.background=='#ff9900') {
document.getElementById(obj).style.background='#00cc00';
}
else { document.getElementById(obj).style.background='#ff9900';
}

}
</script>


Una generica riga (per esempio la prima della tabella) recita cosi:

<table>
<tr>
<td>1</td>
<td id="G1">MARCO</td>
<td onclick="cambia('G1')">X</td>
</tr>
...
</table>

Il problema è che quando premo sulla X lo sfondo di G1 cambia giustamente
colore (diventa #ff9900), ma se RIPREMO sulla stessa X lo sfondo del td dovrebbe
diventare Verde (#00cc00), ma non succede nulla (cioè rimane del colore
#ff9900)

Perchè??????????

Grazie
leonardo.1+++ 13 Giu 2015 00:17
Il 12/06/2015 15:05, manila22@interfree.it ha scritto:
> Ho un problema.
>
> C'è una tabella.
> Ho una funzione js che fa cambiare colore ad un td quando clicco su un altro
td
> La funzione è scritta così:
>
> <script>
>
> function cambia(obj) {
>
> if(document.getElementById(obj).style.background=='#ff9900') {
> document.getElementById(obj).style.background='#00cc00';
> }
> else { document.getElementById(obj).style.background='#ff9900';
> }
>
> }
> </script>
>
>
> Una generica riga (per esempio la prima della tabella) recita cosi:
>
> <table>
> <tr>
> <td>1</td>
> <td id="G1">MARCO</td>
> <td onclick="cambia('G1')">X</td>
> </tr>
> ...
> </table>
>
> Il problema è che quando premo sulla X lo sfondo di G1 cambia giustamente
colore (diventa #ff9900), ma se RIPREMO sulla stessa X lo sfondo del td dovrebbe
diventare Verde (#00cc00), ma non succede nulla (cioè rimane del colore
#ff9900)
>
> Perchè??????????
>
> Grazie
>
in genere questo problema dovrebbe essere affrontato/risolto con jquery
usando this relativamente al tag td che identifica la colonna, o cella
se abbinata al tag tr.
saluti
Leonardo

--
Non sono su facebook
Se anche tu vuoi cancellarti
http://www.giardiniblog.com/come-cancellarsi-da-facebook-eliminare-account/
ciccio 13 Giu 2015 13:16
manila22@interfree.it <manila22@interfree.it> ha scritto:

> Ho un problema.
>
> C'è una tabella.
> Ho una funzione js che fa cambiare colore ad un td quando clicco su un
altro td
> La funzione è scritta così:
>
> <script>
>
> function cambia(obj) {
>
> if(document.getElementById(obj).style.background=='#ff9900') {
> document.getElementById(obj).style.background='#00cc00';
> }
> else { document.getElementById(obj).style.background='#ff9900';
> }
>
> }
> </script>
>
>
> Una generica riga (per esempio la prima della tabella) recita cosi:
>
> <table>
> <tr>
> <td>1</td>
> <td id="G1">MARCO</td>
> <td onclick="cambia('G1')">X</td>
> </tr>
> ....
> </table>
>
> Il problema è che quando premo sulla X lo sfondo di G1 cambia
giustamente colore (diventa #ff9900), ma se RIPREMO sulla stessa X lo
sfondo del td dovrebbe diventare Verde (#00cc00), ma non succede nulla
(cioè rimane del colore #ff9900)
>
> Perchè??????????

Perché nel confronto inserito nell'if, non è presente il caso
in cui il colore sia espresso in un altro formato. Prova a modificare
il confronto in questo modo:

..
if (document.getElementById(obj).style.backgroundColor=='#F90' ||
document.getElementById(obj).style.backgroundColor=='rgb(255, 153, 0)')
{
..
ciccio 13 Giu 2015 13:17
leonardo.1+++ <leonardo.1@fastwebnet.it> ha scritto:

CUT
> in genere questo problema dovrebbe essere affrontato/risolto con jquery
> usando this relativamente al tag td che identifica la colonna, o cella
> se abbinata al tag tr.

Io sono sempre contrario all'uso di jquery per questo livello di cose.
Altrimenti chi comincia non imparerà mai JavaScript.
Alessandro Pellizzari 13 Giu 2015 14:48
Il Fri, 12 Jun 2015 06:05:02 -0700, manila22 ha scritto:

> Ho una funzione js che fa cambiare colore ad un td quando clicco su un
> altro td La funzione è scritta così:

Non cambiare colore. Assegna (e rimuovi al secondo click) una class, poi
nei css fai quello che vuoi.

Bye.
Informatico autodidatta 13 Giu 2015 19:57
Il giorno venerdì 12 giugno 2015 15:05:03 UTC+2, mani...@interfree.it ha
scritto:

> Ho un problema.
[CUT]
> Perchè??????????
perché stai trattando nella condizione, valori esadecimali, e js ritorna valori
rgb!
così funziona:
<script>
function cambia(obj){
var x=document.getElementById(obj);
console.log(x.style.backgroundColor);
if(!x.style.backgroundColor){
x.style.backgroundColor='#0c0';
}else if (x.style.backgroundColor=='rgb(0, 204, 0)'){
x.style.backgroundColor='#f90';
}else if (x.style.backgroundColor=='rgb(255, 153, 0)'){
x.style.backgroundColor='#0c0';
}
}
</script>

<tr>
<td>1</td>
<td id="G1">MARCO</td>
<td onclick="cambia('G1')">X</td>
</tr>

Ricordati sempre! quando ti diranno perché non usi jquery? tu rispondi :
perché devo usare un accrocchio quando posso usare un *LINGUAGGIO* di
programmazione?!

> Grazie
Prego, sono duecentocinquantaquattordici euro.

--
L'Informatico autodidatta.
Alessandro Pellizzari 14 Giu 2015 10:05
Il Sat, 13 Jun 2015 10:57:44 -0700, Informatico autodidatta ha scritto:

> perché stai trattando nella condizione, valori esadecimali, e js ritorna
> valori rgb!

Solo se non stai usando Explorer 8 o inferiori.

> così funziona:
> <script>
> function cambia(obj){
> var x=document.getElementById(obj);
> console.log(x.style.backgroundColor);
> if(!x.style.backgroundColor){
> x.style.backgroundColor='#0c0';
> }else if (x.style.backgroundColor=='rgb(0, 204, 0)'){
> x.style.backgroundColor='#f90';
> }else if (x.style.backgroundColor=='rgb(255, 153, 0)'){
> x.style.backgroundColor='#0c0';
> }
> }
> </script>

<script>
// Mi permetto di dare nomi un po' migliori alle variabili
function cambia(id) {
var $obj = $('#'.id);
$obj.css({
backgroundColor: (
$obj.css('backgroundColor') == 'rgb(255, 153, 0)' ?
'#f90' :
'#0c0'
)
});
}

Non so, a me sembra più leggibile quello in jQuery.

Ma, ancora meglio:

<style>
td { background-color: #0c0; }
td.selected { background-color: #f90; }
</style>
<tr>
<td>1</td>
<td id="G1">MARCO</td>
<td class="changer" data-change="G1">X</td>
</tr>
<script>
$(function() {
$('.changer').on('click', function() {
$('#' + $(this).data('change') ).toggleClass('selected');
}
}
</script>

> Ricordati sempre! quando ti diranno perché non usi jquery? tu rispondi :
> perché devo usare un accrocchio quando posso usare un *LINGUAGGIO* di
> programmazione?!

Sì, conoscere il linguaggio di programmazione aiuta molto, per esempio
per semplificare quell'if a tre vie che hai fatto, ma jQuery non è un
linguaggio, nè un accrocchio. È una libreria, che, se la sai usare, rende
il codice molto più leggibile, flessibile, compatibile e in alcuni casi
anche più veloce.

Se non la sai usare, è un accrocchio.

Bye.
Informatico autodidatta 14 Giu 2015 11:31
Il giorno domenica 14 giugno 2015 10:05:37 UTC+2, Alessandro Pellizzari ha
scritto:

> Solo se non stai usando Explorer 8 o inferiori.
l'rfc css non e` chiaro, anzi e` lacunoso sotto n+1 aspetti, ad esempio non
spiega come trattare i colori, ergo qualcuno tratta valori rgb, altri
esadecimali, se vuoi andare nel UCLO a tutti e due, (entrambi le correnti di
pensiero senza specifiche chiare fanno quel ca22o che vogliono) usi la vecchia
nomenclatura dei nomi coli html.

ad esempio questa cosa funziona sia con mozilla, che ie:

function color(z){
var x=document.getElementById(z);
if(!x.style.backgroundColor){
x.style.backgroundColor='orange';
}else if (x.style.backgroundColor=='orange'){
x.style.backgroundColor='lime';
}else if (x.style.backgroundColor=='lime'){
x.style.backgroundColor='orange';
}
}

> Se non la sai usare, è un accrocchio.

ribadisco, in conformita` con l'art. 21 della costituzione Italiana.
e` un accrocchio.

--
L'Informatico autodidatta.
Pasquale98 14 Giu 2015 12:07
Il giorno domenica 14 giugno 2015 10:05:37 UTC+2, Alessandro Pellizzari ha
scritto:

> // Mi permetto di dare nomi un po' migliori alle variabili

Mi permetto di dire (lol) che in js bastano 2 righe di codice e un operatore
ternario.

--
Pasquale.
Alessandro Pellizzari 14 Giu 2015 14:29
Il Sun, 14 Jun 2015 03:07:03 -0700, Pasquale98 ha scritto:

> Il giorno domenica 14 giugno 2015 10:05:37 UTC+2, Alessandro Pellizzari
> ha scritto:
>
>> // Mi permetto di dare nomi un po' migliori alle variabili
>
> Mi permetto di dire (lol) che in js bastano 2 righe di codice e un
> operatore ternario.

Operatore ternario che veniva usato 5 righe sotto quella che hai
quotato. :P

Bye.
Andrea Scartabelli 14 Giu 2015 15:51
On 14/06/15 11:31, Informatico autodidatta wrote:
> Il giorno domenica 14 giugno 2015 10:05:37 UTC+2, Alessandro Pellizzari ha
scritto:
>
>> Solo se non stai usando Explorer 8 o inferiori.
> l'rfc css non e` chiaro, anzi e` lacunoso sotto n+1 aspetti, ad esempio non
spiega come trattare i colori, ergo qualcuno tratta valori rgb, altri
esadecimali, se vuoi andare nel UCLO a tutti e due, (entrambi le correnti di
pensiero senza specifiche chiare fanno quel ca22o che vogliono) usi la vecchia
nomenclatura dei nomi coli html.
>
> ad esempio questa cosa funziona sia con mozilla, che ie:
>
> function color(z){
> var x=document.getElementById(z);
> if(!x.style.backgroundColor){
> x.style.backgroundColor='orange';
> }else if (x.style.backgroundColor=='orange'){
> x.style.backgroundColor='lime';
> }else if (x.style.backgroundColor=='lime'){
> x.style.backgroundColor='orange';
> }
> }

A maggior ragione, visto che possono esistere differenze di
implementazione, ritengo che la "risposta corretta" sia quella data
Alessandro in un altro post: usare classi CSS.

Oltretutto è più sensato: il concetto è avere un elemento evidenziato e
non credo che stia alla logica del codice sapere con che colore.
Non gli spetta e non è suo compito.

Visto che è ampiamente supportato (cfr.
<http://caniuse.com/#feat=classlist>) io peraltro userei "classList" e
il suo metodo "toggle", aggiungendo uno shim / polyfill se necessario.

Vedi: <https://developer.mozilla.org/en-US/docs/Web/API/Element/classList>
Informatico autodidatta 14 Giu 2015 16:20
Il giorno domenica 14 giugno 2015 15:51:26 UTC+2, Andrea Scartabelli ha scritto:

> A maggior ragione, visto che possono esistere differenze di
> implementazione, ritengo che la "risposta corretta" sia quella data
> Alessandro in un altro post: usare classi CSS.
>
> Oltretutto è più sensato: il concetto è avere un elemento evidenziato e
> non credo che stia alla logica del codice sapere con che colore.
> Non gli spetta e non è suo compito.

oh Santa Genoveffa, incoronata in bicicletta, cos'é la giornata dei
tempera*****i?

1) la domanda dell'op e` perché non funziona
2) uso lo statement dell'op per spiegare perché non funziona
3) qualora l'op avesse chiesto qual è la best practice, per otterere detto
risultato, avrei esposto la mia implementazione.
4) non me ne fotte un ******* di leggere la documentazione di mozilla
5) fino a prova contraria qualunque metodo è perseguibile per raggiungere un
dato scopo, compreso quello di usare l'accrocchio jquery.
6) il fatto che tu ritenga sensato il motodo proposto da X e` irrilevante al
fine del quesito della domanda, che resta perché non funziona
7) non sono convinto che tu abbia compreso, ergo rileggi con questi 7 punti.

//end

--
L'Informatico autodidatta.
Andrea Scartabelli 14 Giu 2015 19:15
On 14/06/15 16:20, Informatico autodidatta wrote:

[...]

> oh Santa Genoveffa, incoronata in bicicletta, cos'é la giornata dei
tempera*****i?

Pare proprio di sì!

Ma non ti preoccupare, una giornata storta capita a tutti.

Links
Giochi online
Dizionario sinonimi
Leggi e codici
Ricette
Testi
Webmatica
Hosting gratis
   
 

Il linguaggio JavaScript | Tutti i gruppi | it.comp.lang.javascript | Notizie e discussioni javascript | Javascript Mobile | Servizio di consultazione news.