Immagini e pulsanti

[YOGHI87]

Salve, come posso fare per far cambaire immagine se clicchi su un bottone??
In pratica io ho 2 bottoni, 1 luce ON l' altro off_ e quindi se clicco su ON mi viene un immagine se clicco su off ne viene un altra....

[artorius]

Metti di avere le SRC delle due immagini in due variabili e lo stato in cui si trova il tag IMG che contiene l'immagine:

var srcON = "path/ad/immagine/on.jpg", srcOFF = "path/ad/immagine/off.jpg";
var status = 0; // 0 = off, 1 = on

Crei una funzione per sostituire l'src dell'immagine a seconda dello stato:

function ToogleImg(id){
   status = (status + 1) % 2;
   var imgTag = document.all ? document.all[id] : document.getElementById(id);
   imgTag.src = status == 0 ? srcOFF : srcON;
}

Poi associ la funzione all'evento onClick del bottone o del link:

[img]path/ad/immagine/off.jpg[/img]
<input type="button" onclick = "ToogleImg('MyImage')" value = "Cambia" />

Ed il gioco è fatto

[YOGHI87]

in pratica il mio onclick ha già una funzione javascript, posso usarle tutte e 2 insieme ? Se si come??

Comunque Grazie

[br1]

Originariamente inviato da YOGHI87
in pratica il mio onclick ha già una funzione javascript, posso usarle tutte e 2 insieme ? Se si come??

Comunque Grazie

onlick="funzione1();funzione2();funzione3();"

ciao

[YOGHI87]

Grazie, comunque cosi non funziona... ho provato solo con l'evento del cambio immagine ma mi inserisce le immagini nella pagina cioè mi ritrovo 3 immagini...
in pratica io ho un'immagine standard e sopra 2 pulsanti se clicchi uno mi compare un'altra immagine al posto di quella standard e se clicchi l'altro pulsante un'altra immagine ancora...

[br1]

Originariamente inviato da YOGHI87
Grazie, comunque cosi non funziona... ho provato solo con l'evento del cambio immagine ma mi inserisce le immagini nella pagina cioè mi ritrovo 3 immagini...
in pratica io ho un'immagine standard e sopra 2 pulsanti se clicchi uno mi compare un'altra immagine al posto di quella standard e se clicchi l'altro pulsante un'altra immagine ancora...

Posta il codice o, meglio, un link alla pagina.

ciao

[YOGHI87]

Ciao, guarda io ho 2 pulsanti fatti in questo modo:

<input type=image img src="immagini/on.jpg" id=oIndividualAddressWrite onClick="if (event.shiftKey) { if ( GetSelectedEdiType()==EdiTypeUndefined ) HighLight('PortNumberBox;EdiTypeBox;IpTypeBox;IpAd dress;ConfigPort;ReadPort;WritePort;DeviceAddress' ); else HighLight('PortNumberBox;EdiTypeBox;DeviceAddress' ); } else IndividualAddressWrite("0/2/1", 1);" value="ON">

questo è on e c'è l'identico però è off...
Sotto un'immagine standard, e quello che vorrei e che se premo On mi compare un'altra immagine al posto di quella standard e cosi anche per off...

[br1]

Cambia i doppi apici in apici singoli...

IndividualAddressWrite("0/2/1", 1)

ciao

[YOGHI87]

ok grazie, ma centra qualcosa con il discorso dell'immagine che voglio fare io?? quelle sono funzioni che mi servono per un progetto domotico, a me serve sapere come posso fare per cambiare immagine se clicco sul pulsante... :master:

[YOGHI87]

ho provato a fare cosi: ho dato un id all'immagine (mappa_bagno) e nel pulsante ho fatto cosi:

<input type=image img src="immagini/on.jpg" id=oIndividualAddressWrite  onClick  = "document.getElementById('mappa_bagno').src='immagini/pianta_bagnoON.jpg'"; "if (event.shiftKey) { if ( GetSelectedEdiType()==EdiTypeUndefined ) HighLight('PortNumberBox;EdiTypeBox;IpTypeBox;IpAddress;ConfigPort;ReadPort;WritePort;DeviceAddress'); else HighLight('PortNumberBox;EdiTypeBox;DeviceAddress'); } else IndividualAddressWrite("0/4/1", 1);" value="ON">

dove ci sono 2 eventi uno è il cambio dell'immagine e l'altro tutte le funzioni domotiche... Però non capisco perchè mi dà questo errore:
Tag non validi perchè contiene un attributo doppio, rimuovere l'attributo duplicato.

Il ragionameto sembra giusto, no? ma perchè quest'errore?? non posso dare 2 eventi a onClick???