Sto provando a fare un semplice pulsante di commutazione in javascript

Sto provando a fare un semplice pulsante di commutazione in javascript. Tuttavia, il pulsante si trasformerà solo "OFF" e non tornare indietro "ON"Sto provando a fare un semplice pulsante di commutazione in javascript

<html><head></head> 
<script type="text/javascript"> 
function toggle(button) 
{ 
    if(document.getElementById("1").value=="OFF"){ 
    document.getElementById("1").value="ON";} 

    if(document.getElementById("1").value=="ON"){ 
    document.getElementById("1").value="OFF";} 
} 
</script> 
<body> 
<form action=""> 
<input type="button" id="1" value="ON" style="color:blue" 
     onclick="toggle(this);"> 
</form></body></html>

Sono in esecuzione: HP Netbook: Ubuntu Linux 10.04: Firefox per Ubuntu 1.0.

fonte

2010-06-15 CDeanMartin

Entrambi tuoi if dichiarazioni sono sempre eseguiti uno dopo l'altro, come si cambia il valore e poi subito a leggerlo di nuovo e cambiare di nuovo:

function toggle(button) 
{ 
    if(document.getElementById("1").value=="OFF"){ 
    document.getElementById("1").value="ON";} 

    else if(document.getElementById("1").value=="ON"){ 
    document.getElementById("1").value="OFF";} 
}

Aggiungendo il else in ci dovrebbe fermare questo accada.

fonte

2010-06-15 18:05:04 richsage

Inoltre, se lo sai il valore può essere solo "ON" o "OFF", puoi omettere il secondo 'if' completamente e usare semplicemente' else'. –

Perché stai passando il pulsante se stai andando a cercarlo?

Inoltre, poiché si conoscono i valori possibili, è sufficiente controllare se è OFF, altrimenti, si sa che è ON.

// Toggles the passed button from OFF to ON and vice-versa. 
function toggle(button) { 
    if (button.value == "OFF") { 
    button.value = "ON"; 
    } else { 
    button.value = "OFF"; 
    } 
}

se si vuole ottenere fantasia e risparmiare un paio di byte è possibile utilizzare l'operatore ternario:

function toggle(b){b.value=(b.value=="ON")?"OFF":"ON";}

fonte

2010-06-15 18:08:07

Dimostrato a http://www.jsfiddle.net/EfjUB/1/ – gnarf

Neat, mai a capo di jsfiddle prima, grazie! –

perché non utilizzare un interruttore?

function toggle(button) 
{ 
    switch(button.value) 
    { 
      case "ON": 
       button.value = "OFF"; 
       break; 
      case "OFF": 
       button.value = "ON"; 
       break; 
    } 
}

fonte

2010-06-15 18:18:04 Tester101

'.value' not' .Value' – gnarf

Un parametro per un valore booleano è un tipo di overkill. –

Un altro metodo per fare questo è:

var button = document.querySelector("button"); 
var body = document.querySelector("body"); 
var isOrange = true; 

button.addEventListener("click", function() { 
if(isOrange) { 
    body.style.background = "orange"; 
}else { 
    body.style.background = "none"; 
} 
isOrange = !isOrange; 
});

Nel file JavaScript.

/*****

NOTA! Un altro modo è applicare una classe all'elemento che vogliamo modificare.

Il file CSS deve avere la classe con il formato che vogliamo:

.orange { 
background: orange; 
}

In ultimo nel nostro file js abbiamo solo bisogno di rendere l'applicazione della classe:

var button = document.querySelector("button"); 
button.addEventListener("click", function() { 
    document.body.classList.toggle("orange"); 
});

Saluti :)

fonte

2017-05-20 18:15:52

<html> 
    <head> 
     <script type="text/javascript"> 
      function toggle(button) 
      { 
       if(document.getElementById("1").value=="OFF") 
       { 
       document.getElementById("1").value="ON"; 
       } 
       else 
       { 
       document.getElementById("1").value="OFF"; 
       } 
      } 
     </script> 
    </head> 
    <body> 
     <form action=""> 
      <input type="button" id="1" value="ON" style="color:blue" onclick="toggle(this);"> 
     </form> 
    </body> 
</html>

fonte

2017-08-20 17:25:14

metti sempre lo script nel tag head perché i tuoi script vengono caricati prima quando la pagina viene caricata –

Sto provando a fare un semplice pulsante di commutazione in javascript

risposta

Problemi correlati