Javascript：Chromeで警告方法を停止できません

Question

私は入力テキストと入力テキスト値を確認するためのボタンがあります。

Webページが読み込まれると、入力テキストにフォーカスが置かれ、この値はデフォルトでは空です。

したがって、入力テキスト値（onblur）の外側にフォーカスを置くと、check_input_value（event）関数は、入力テキスト値が空の場合にアラート（「入力値は空ではありません」）を1回実行します。

これはFirefoxで完全に機能します。しかし、Chromeでは、このアラートは1回ではなく無期限に実行されます。ここで

コード（あなたはhttps://jsfiddle.net/fcg86gyb/で）Chromeでそれを試してみてください（それを試すことができます）：

<input type="text" id="input_text"> <input type="button" value="Check input value" onclick="check_input_value(event);"> 

<script type="text/javascript"> 

//Get the input text element : 
input_text = document.getElementById("input_text"); 

//Put focus in input text : 
input_text.focus(); 

/*Add event listener in the input text element. 
On blur, if your input value is empty, then execute check_input_value(event) function 
to check input text value : 
*/ 
input_text.addEventListener('blur', 

            function(event) 
            { 
             var event = window.event || event; 
             check_input_value(event); 
            } 
            , false 
         ); 

//Function for checking input text value : 
//if the input value is empty, display alert "Your input value must not empty", and put focus in input text.       
function check_input_value(event) 
{ 
    var event = window.event || event; 

    if(input_text.value == "") 
    { 
     alert("Your input value must not empty"); 

     input_text.focus(); 

     return false; 
    } 
} 

</script> 

クロムで無期限に1時間にアラートを実行する代わりにするには、どのように？

Answer 1

関数は常に入力テキストにフォーカスを戻し、関数が呼び出すフォーカスを常に変更するため、chromeは1回ではなく無期限に実行されます。 Firefoxでは、入力テキストがjavascript関数の最後にフォーカスを受け取らないのでうまく動作します。 input_text.focus();を削除すると動作します。

Answer 2

jsfiddleへのリンクありがとうございます。私はそれを試してみたところ、input_text.focus（）が再帰的に呼び出されていたことがわかりました。

私はそれをコメントしています。私は、あなたがどこかで呼び出しが再帰的でないかもしれないところのどこかでinput_text.focus（）を呼び出すべきだと思います。あなたは一度だけ警告ボックスを表示した後、テキストボックスにフォーカスを維持する必要がある場合は私が述べたように、あなたは一時変数を利用することができますhttps://jsfiddle.net/fcg86gyb/1/

//Get the input text element : 
input_text = document.getElementById("input_text"); 

//Put focus in input text : 
input_text.focus(); 

/*Add event listener in the input text element. 
On blur, if your input value is empty, then execute check_input_value(event) function : 
*/ 
input_text.addEventListener('blur', 

           function(event) 
           { 
            var event = window.event || event; 
            check_input_value(event); 
           } 
           , false 
        ); 

//Function for checking input text value : 
//if the input value is empty, display alert "Your input value must not  empty", and put focus in input text.       
function check_input_value(event) 
{ 
    var event = window.event || event; 

if(input_text.value == "") 
{ 
    alert("Your input value must not empty"); 
    //input_text.focus(); 

    return false; 
} 
} 

：

は、これは私が試したリンクですあなたは次のように同じ達成することができます：

//Get the input text element : 
input_text = document.getElementById("input_text"); 

//Put focus in input text : 
input_text.focus(); 
var temp = 0; 
/*Add event listener in the input text element. 
On blur, if your input value is empty, then execute check_input_value(event) function : 
*/ 
input_text.addEventListener('blur', 

function(event) 
{ 
    var event = window.event || event; 
    if(temp == 0) 
    { 
     check_input_value(event); 
    } 
    else 
    { 
     button_focus(); 
    } 
} 
, false); 

//Function for checking input text value : 
//if the input value is empty, display alert "Your input value must not empty", and put focus in input text.       
function check_input_value(event) 
{ 
var event = window.event || event; 

    if(input_text.value == "") 
    { 
    alert("Your input value must not empty"); 
    input_text.focus(); 
    temp = 1; 
    return false; 
    } 
} 
function button_focus() 
{ 
    if(input_text.value == "") 
    { 
    input_text.focus(); 
    } 
    temp = 0; 
    return false; 
} 

私はそれが役立ちます。

Answer 3

これはChrome 52（discussed here）の不具合のようです。思い付いた問題を回避するには、blurイベントを削除し、タイムアウトでそれを再接続することでした：

if(input_text.value == "") 
{ 
    alert("Your input value must not empty"); 

    var tmpBlur = input_text.blur; 
    input_text.blur = null;  
    setTimeout(function() { 
     input_text.focus(); 
     input_text.blur = tmpBlur; 
    }, 0); 

    return false; 
} 

https://jsfiddle.net/wpys5x75/3/

EDIT：それはあなたのように見えますが

はまだときに、同じ無限ループを取得ウィンドウの外側をクリックします。周りのもう一つの仕事は別の値を代入して、タイムアウトの値を再割り当てするために、次のようになります。

if(input_text.value == "") 
{ 
    alert("Your input value must not empty"); 

    input_text.value = ' '; 
    setTimeout(function() { 
     input_text.focus(); 
     input_text.value = ''; 
    }, 0); 

    return false; 
} 

https://jsfiddle.net/wpys5x75/5/