Ändern div bgcolor onkeypress

Question

Versuchen, die Hintergrundfarbe aller meine Divs mit einem onkeypress Ereignis zu ändern. R = Rot, B = Weiß, V = Grün. Wenn man R drückt, funktioniert es, aber wenn ich V oder B drücke, gibt es Alarm. Ich versuchte ohne Rückkehr, mit einem Schalter (eigentlich sollte ich dies mit einem Schalter tun). Lehrer hat heute abgesagt, also konnte ich es nicht mit ihm besprechen. Und ich werde ihn bis nächste Woche nicht sehen. Ich habe versucht, Dinge und andere Dinge für 2-3 Stunden und im totaly stecken Bitte helfen .. Vielen Dank im Voraus

window.onkeypress = function colorchange(x) 
    { 
     if (x.keyCode == 114) 
      { var divs = document.getElementsByTagName("div"); 
      for(var i = 0; i < divs.length; i++) 
      { 
      divs[i].style.backgroundColor = "red"; 
      }return; 
      } 
     if (x.keycode == 118) 
      { 
      var divs = document.getElementsByTagName("div"); 
      for(var i = 0; i < divs.length; i++) 
      { 
      divs[i].style.backgroundColor = "green"; 
      }return; 
      } 
     if (x.keycode == 98) 
     { 

      var divs = document.getElementsByTagName("div"); 
      for(var i = 0; i < divs.length; i++) 
      { 
      divs[i].style.backgroundColor = "white"; 
      }return; 
     } 
     else 
     { 
      alert("this key doesnt do anything") 

     } 
    } 

}

Answer 1

Du x.keycode statt x.keyCode in den zweiten und dritten if Aussagen zu vergleichen. Sie sollten die Bedingungen auch verketten, indem Sie else if verwenden.

window.onkeypress = function colorchange(x) 
{ 
    if (x.keyCode === 114) { 
    var divs = document.getElementsByTagName("div"); 
    for (var i = 0; i < divs.length; i++) 
    { 
     divs[i].style.backgroundColor = "red"; 
    } 
    return; 
    } 
    else if (x.keyCode === 118) 
    { 
    var divs = document.getElementsByTagName("div"); 
    for(var i = 0; i < divs.length; i++) 
    { 
     divs[i].style.backgroundColor = "green"; 
    } 
    return; 
    } 
    else if (x.keyCode === 98) 
    { 
    var divs = document.getElementsByTagName("div"); 
    for(var i = 0; i < divs.length; i++) 
    { 
     divs[i].style.backgroundColor = "white"; 
    } 
    return; 
    } 
    else 
    { 
    alert("this key doesnt do anything") 
    } 
} 

Siehe working jsfiddle here.

Answer 2

Die Variablen Fall empfindlich sind. Sie haben keycode und es sollte keyCode sein. Sieht so aus, als ob Sie auch verwenden sollten.

window.onkeypress = function colorchange(x) { 
 
    if (x.keyCode == 114) { 
 
    var divs = document.getElementsByTagName("div"); 
 
    for (var i = 0; i < divs.length; i++) { 
 
     divs[i].style.backgroundColor = "red"; 
 
    } 
 
    return; 
 
    } else if (x.keyCode == 118) { 
 
    var divs = document.getElementsByTagName("div"); 
 
    for (var i = 0; i < divs.length; i++) { 
 
     divs[i].style.backgroundColor = "green"; 
 
    } 
 
    return; 
 
    } else if (x.keyCode == 98) { 
 
    var divs = document.getElementsByTagName("div"); 
 
    for (var i = 0; i < divs.length; i++) { 
 
     divs[i].style.backgroundColor = "white"; 
 
    } 
 
    return; 
 
    } else { 
 
    alert("this key doesnt do anything") 
 
    } 
 
}

body { 
 
background: #eee; 
 
} 
 

 
div { 
 
width: 100px; 
 
height: 100px; 
 
background: #aaa; 
 
}

<div></div>