Ich versuche, eine einfache Umschaltfläche in Javascript

Ich versuche, eine einfache Umschaltfläche in Javascript zu machen. Allerdings wird die Schaltfläche nur drehen "OFF" und werden nicht zurückdrehen "ON"Ich versuche, eine einfache Umschaltfläche 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>

Ich arbeite mit: HP Netbook: Ubuntu Linux 10.04: Firefox für Ubuntu 1.0.

Quelle

2010-06-15 CDeanMartin

Ihre beiden if Aussagen sind immer eine nacheinander ausgeführt, wie Sie den Wert ändern und dann sofort wieder lesen und ändern zurück:

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";} 
}

das Hinzufügen von else dort sollte dies verhindern.

Quelle

2010-06-15 18:05:04 richsage

Auch, wenn Sie das wissen der Wert kann nur "ON" oder "OFF" sein, Sie können das zweite 'if' komplett weglassen und einfach' else' verwenden. –

Warum übergeben Sie den Knopf, wenn Sie nachschlagen?

Da Sie auch die möglichen Werte kennen, müssen Sie nur überprüfen, ob es ausgeschaltet ist, sonst wissen Sie, dass es eingeschaltet ist.

// 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"; 
    } 
}

Wenn Sie Lust bekommen wollen und ein paar Bytes speichern Sie den ternären Operator verwenden:

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

Quelle

2010-06-15 18:08:07

Demonstriert bei http://www.jsfiddle.net/EfjUB/1/ – gnarf

Ordentlich, nie Kopf von jfiddle vorher, danke! –

Warum nicht einen Schalter benutzen?

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

Quelle

2010-06-15 18:18:04 Tester101

'.value' nicht' .Value' – gnarf

Ein Schalter für einen booleschen Wert ist eine Art Overkill. –

Eine andere Methode, dies zu tun ist:

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; 
});

In der JavaScript Datei.

/*****

HINWEIS! Eine andere Möglichkeit ist das Anwenden einer Klasse auf das Element, das wir ändern möchten.

Die CSS Datei muss die Klasse mit dem Format wollen wir:

.orange { 
background: orange; 
}

Durch letzte in unserer js Datei brauchen wir nur die Anwendung der Klasse zu machen:

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

Grüße :)

Quelle

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>

Quelle

2017-08-20 17:25:14

Setzen Sie das Skript immer in head tag, da Ihre Skripts zuerst geladen werden, wenn Ihre Seite geladen wird –

Ich versuche, eine einfache Umschaltfläche in Javascript

Antwort

Verwandte Themen