If-Anweisung ist immer falsch, auch wenn die Bedingung in Java-Skript ist

-3

Dies ist das Javascript und HTML und CSS Ich bin sehr neu in Javascript das Problem ist, wenn Anweisung immer falsch angezeigt wird, obwohl es nicht sollte Anweisung immer falsch ist auch wenn ich auf dem Wert der Farbe des Gewinn Variable klicken, dass der Wert des dritten Index der Array-Farben seines zeigt falscheIf-Anweisung ist immer falsch, auch wenn die Bedingung in Java-Skript ist

var colors = [ 
 
\t "rgb(255,0,0)", 
 
\t "rgb(255,255,0)", 
 
\t "rgb(0,255,0)", 
 
\t "rgb(0,255,255)", 
 
\t "rgb(0,0,255)", 
 
\t "rgb(255,0,255)" 
 
\t ] 
 
var win =colors[3]; 
 
var winclrdisplay=document.querySelector(".winclr"); 
 
var square= document.querySelectorAll(".square"); 
 

 
\t winclrdisplay.textContent=" "+ win; 
 
\t 
 
\t for (var i = 0 ;i < square.length ; i++){ 
 
\t \t //colors 
 
\t \t square[i].style.background =colors[i]; 
 
\t \t 
 
\t \t // click listener 
 
\t \t square[i].addEventListener("click", function(){ 
 
\t \t var click = this.style.background; 
 
\t \t if (click == win){ 
 
\t \t \t alert("correct"); 
 
\t \t }else{ 
 
\t \t \t alert("wrong"); 
 
\t \t } 
 
\t \t } 
 
    \t \t); 
 
\t }

body { 
 
\t background-color: #232323; 
 
} 
 

 
.square{ 
 
\t width: 30%; 
 
\t background: purple; 
 
\t padding-bottom: 30%; 
 
\t float: left; 
 
\t margin: 1.66%; 
 

 

 
} 
 

 
#container { 
 
\t max-width: 600px; 
 
\t margin: 0 auto; 
 
} 
 
h1 { 
 
\t color:white; 
 
}

<html> 
 
<head> 
 
\t <title>color guessing game</title> 
 
\t <link rel="stylesheet" type="text/css" href="colorapp.css"> 
 

 
</head> 
 
<body> 
 
\t <h1>The Great <span class="winclr"></span> colour Game</h1> 
 
\t 
 
<div id="container"> 
 
<div class="square"></div> 
 
<div class="square"></div> 
 
<div class="square"></div> 
 
<div class="square"></div> 
 
<div class="square"></div> 
 
<div class="square"></div> 
 
</div> 
 
<script type="text/javascript" src="colorapp.js"></script> 
 
</body> 
 
</html>

Quelle

2017-05-16 Sim Sheeraz

Sie wollen eine 'console.log tun (click)', um zu sehen, welchen Wert Sie sind _actually_ bekommen. – CBroe

Mögliches Duplikat von [Wie kann ich zwei Farbwerte in jQuery/JavaScript vergleichen?] (Http://stackoverflow.com/questions/2377696/how-can-i-compare-two-color-values-in-jquery-javascript)) – CBroe

überlege, die Farben in hexadezimalen Code zu schreiben, der als String verglichen werden kann –

es ist fast unmöglich, Ihre Frage, wie es zu verstehen, ist nicht gut formatiert. Aber von einem kurzen Blick Sie vermissen eine Schließung ) in Ihrem if statment

if (click == "rgb(0,255,255"){

sollte

if (click == "rgb(0,255,255)"){

oder

if (click == rgb(0,255,255)){

(wieder, ich bin nicht sicher, was Sie Ziel)

Quelle

2017-05-16 08:51:47

der letzte führt zu einem Fehler, weil 'rgb (...)' wird nicht definiert .. – Founded1898

Ich glaube, er versucht nur, die RGB-Farbe zu bekommen, wo er auf die Seite klickt. – JORDANO

ja ich versuche, die farbe von der seite auf die verschiedenen boxen –

Verwenden Sie element.getComputedStyle. element.style ruft den Wert ab, wenn der CSS-Stil inline ist. Es ist immer falsch, weil es keinen Wert hat.

so etwas wie dieses

var element = document.getElementById('box'), 
      style = window.getComputedStyle(element), 
      bg = style.getPropertyValue('background-color'); 

    console.log(bg);

Quelle

2017-05-16 08:54:36

Was ist ein Fensterelement colorapp.js: 23 Uncaught TypeError: Fehler beim Ausführen von 'getComputedStyle' auf 'Window': Parameter 1 ist nicht vom Typ 'Element'. bei HTMLDivElement. (colorapp.js: 23) –

If-Anweisung ist immer falsch, auch wenn die Bedingung in Java-Skript ist

Antwort

Verwandte Themen