신속한 응답시 신속한 배경 변경

저는 JS에서 멍청한 놈입니다. 간단한 색을 추측하는 숙제를하고 있습니다. 지금까지 모든 것은 기준이 적용되는 한 작동합니다.신속한 응답시 신속한 배경 변경

내 유일한 문제는 사용자 입력시 바로 배경이 변경되도록하는 방법을 알아낼 수 없다는 것입니다 (프롬프트에서 [확인]을 클릭 한 직후). 아래의 코드에서, Congrats alert에서 [OK]를 클릭 한 후에 만 배경이 바뀝니다. 저는 교수님이 강의에서 올바른 것을 추측 한 후 배경색이 바뀌는 예제를 보여주기 때문에 가능하다고 확신합니다. 색깔!

또한 전문가가 내 코드를 연마 할 때 제안을 줄 수 있다면 좋을 것입니다. 나는 그것이 성취하려고하는 것보다 지저분하고 복잡하다는 느낌이 들었다. ..Heh .. ..

추신 : 나는 js 논리가 그 페이지에서 분리되어야한다고 생각한다. 그러나 나의 교수는 우리가이 훈련을 대본 인라인!

감사합니다.

<body onload="doGame()"> 
 
    <script> 
 
     var myBody = document.getElementsByTagName("body")[0]; 
 
     var target; 
 
     var answer; 
 
     var guessInputText; 
 
     var guessInput; 
 
     var finished = false; 
 
     var guessAmount = 0; 
 
     var colors = ['Salmon', 'Tomato', 'Moccasin', 'Peru', 'Olive', 'Teal', 'Navy', 'Thistle', 'Beige', 'Gray']; 
 
     var colorsSorted = colors.sort(); 
 
     var colorsSortedString = colors.join(', '); 
 

 
     function doGame() { 
 
      var randomColorNum = Math.random() * 10; 
 
      var randomColorNumInt = Math.floor(randomColorNum); 
 
      target = colors[randomColorNumInt + 1]; 
 
      answer = target.charAt(0).toLowerCase() + target.slice(1).toLowerCase(); //makes sure answer is in lowercase 
 
      alert("The answer is " + target + " or " + answer); //for debugging 
 

 
      while(!finished) { 
 
       guessInputText = prompt('I am thinking of one of these colors:\n\n' + 
 
             colorsSortedString + '\n\n' + 
 
             'What color am I thinking of?'); 
 
       guessInput = guessInputText.charAt(0).toLowerCase() + guessInputText.slice(1).toLowerCase(); //converts whatever input into lowercase 
 
       guessAmount += 1; 
 
       finished = checkGuess(); //checks to see if user input is correct 
 
      } 
 
     } 
 

 
     function checkGuess() { 
 
      if ((colors.indexOf(guessInputText.charAt(0).toUpperCase() + guessInputText.slice(1).toLowerCase()) > -1) == false) { 
 
       alert("Sorry, I don't recognize your color.\n\n" + 
 
         "Please try again!"); 
 
       return false; 
 
      } 
 
      if (guessInput > answer) { 
 
       alert("Sorry, Your guess is incorrect!\n\n" + 
 
         "Hint: Your color is alphabetically higher than mine.\n\n" + 
 
         "Please try again!"); 
 
       return false; 
 
      } 
 
      if (guessInput < answer) { 
 
       alert("Sorry, Your guess is incorrect!\n\n" + 
 
         "Hint: Your color is alphabetically lower than mine.\n\n" + 
 
         "Please try again!"); 
 
       return false; 
 
      } 
 
       myBody.style.background = answer; 
 
       alert("Congratulations! You have guessed the color!\n\n" + 
 
         "It took you " + guessAmount + " guesses to finish the game!\n\n" + 
 
         "You can see the color in the background."); 
 
       return true; 
 
    } 
 
    </script> 
 
</body>

출처

2016-10-14 jossr

당신이 축하 인쇄의 [OK] 전에 배경을 수정하려면 , 당신은 단지이 줄

myBody.style.background = answer;

하지만 .. 당신의 조각을 테스트를 이동해야, 추측 색상 프롬프트에서 확인을 누르면 배경이 바뀝니다.

그럼 정확히 무엇을 원하니? 한 걸음 씩 우리에게 예제를 줄 수 있습니까?

출처

2016-10-14 12:06:38 Aks

답변 해 주셔서 감사합니다. 흥미 롭습니다. Chrome을 사용하고 있습니다.이 정확한 파일을 열면 축하 메시지에서 [확인]을 클릭하기 전까지는 bg가 변경되지 않습니다. 정답을 입력하면 bg가 변경됩니다. Congrats Alert – jossr

과 같은 시간에 setTimeOut을 추가하면 Congrats 경고가 표시되고 변경되기 전에 bg가 변경되기 전에 도움이 될 것입니다. – jossr

신속한 응답시 신속한 배경 변경

답변

관련 문제