入力として色を取得し、ユーザーがキャンセルボタンをクリックするまで背景と前景色を繰り返し変更します

私はこの質問を受け付けています：ユーザーにお気に入りの背景と前景色を入力するように求めます。値を受け取って、ページの背景と前景と同じものを適用します。ユーザーが「いいえ」（キャンセルボタンを押す）と答えるまで、これらの詳細についてユーザーにプロンプトを表示し続けます。入力として色を取得し、ユーザーがキャンセルボタンをクリックするまで背景と前景色を繰り返し変更します

これは私がこれまでにやったことです：

<html> 
    <head> 
    <title>Color change</title> 
    </head> 

    <body> 
    <p id="msg">Test sentence</p> 
    <button onclick=myFunction()>Input</button> 
    <script> 
    function myFunction(){ 

     do{ 
     var a=prompt("Input backgroud color.","red"); 
     document.body.style.backgroundColor=a; 
     var b=prompt("Input foreground color.","green"); 
     document.body.style.color=b; 
     }while(a!=""); 
    } 

    </script> 
    </body> 
</html>

このコードは、単に入力を求め続けると、色の変化を反映するものではありません。ユーザーがキャンセルをクリックするまで各入力後に色を変更したい。提案が役に立ちます。ありがとう。

出典

2017-08-14 Raja Dorji

Y私たちのコードはうまく動作します –

@HoussemBdrしかし、各ループの後に変更を反映していない –

ループ・ブロック、あなたの変更を反映するからブラウザながら、このコードスニペットを使用します。

<button onclick="changeColor()">Input</button> 
<script type="text/javascript"> 
function changeColor() { 
    let a = prompt("Input backgroud color.", "red"); 
    if (a !== '') { 
     document.body.style.backgroundColor = a; 
     let b = prompt("Input foreground color.", "green"); 
     document.body.style.color = b; 
     window.setTimeout(changeColor, 0); 
    } 
} 
</script>

出典

2017-08-14 08:16:39 tibetty

ありがとう、それはうまく機能しました –

私はなぜループが変更をブロックするのか教えてくださいできますか？ –

これはブラウザの実装に依存していますが、スクリプトがまだ実行されている場合、ほとんどのブラウザはDOMを更新しないことがわかりました。 – tibetty

あなたはフレームが

function myFunction() { 
 
    var colors = ['red', 'green']; 
 
    var i = 0, 
 
     input = 1; 
 

 
    function callback() { 
 
     input = prompt("Input backgroud color.", colors[i++ % colors.length]); 
 
     if (input && ~colors.indexOf(input)) { 
 
      document.body.style.color = input; 
 
      window.requestAnimationFrame(callback); 
 
     } 
 
    } 
 
    window.requestAnimationFrame(callback); 
 
}

Test sentence 
 
<button onclick=myFunction()>Input</button>

準備ができていた後

コールバックが想起される使用することができます

出典

2017-08-14 08:20:54

あなたの答えをありがとう:) –

入力として色を取得し、ユーザーがキャンセルボタンをクリックするまで背景と前景色を繰り返し変更します

答えて

関連する問題