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。

希望这可以帮助。