JavaScript document.body.style.backgroundColor 在 while 循環中不起作用

Question

我正在使用 while 循環提示用戶輸入更改背景 - 前景顏色，直到用戶輸入 no。但是顏色在運行時不會改變，顏色僅在用戶說 no 和循環中斷時改變，而不是每次輸入時。 所以只有最后輸入的顏色/值才會在頁面上生效。 當我在調試模式下運行它時，它工作正常。

 function page_color() { while(1) { var input1=prompt("What is your favourite background color"); if (input1=='No' || input1=='no') break; document.body.style.backgroundColor = input1; var input2=prompt("What is your favourite foreground color"); if(input2=='No' || input2=='no') break; document.body.style.color = input2; } }

 <button onclick="page_color()">click here to change foreground and background color of page</button>

Answer 1

我不知道為什么在 page_colour function 中需要一個 while 循環。

以下代碼似乎運行得很好。

<script>
  function page_color()
{

    var input1=prompt("What is your favourite background color"); 
    document.body.style.backgroundColor = input1;

    var input2=prompt("What is your favourite foreground color");
    document.body.style.color = input2;  

}
</script>
<button onclick="page_color()">click here to change foreground and background color of page</button>

無論如何，您的問題的答案由 W3schools 給出。

https://www.w3schools.com/jsref/met_win_prompt.asp

不要過度使用此方法，因為它會阻止用戶在關閉框之前訪問頁面的其他部分。 如果用戶單擊“確定”，則 prompt() 方法返回輸入值。 如果用戶單擊“取消”，則該方法返回 null。

由於提示和警報語句阻塞了您的應用程序流程，因此開發人員不使用它。 （也因為它看起來很丑）

提示的替代方案？

使用input字段收集用戶輸入數據並添加 onClick 事件處理程序來運行您的 page_colour function。

希望這可以幫助。