alert（）の後にfocus（）を与える方法？

Question

私は次のようなものを持っています：

<input type="textbox" id="partNumber" onChange="validatePart(this);"> 
<input type="textbox" id="quantity" onfocus="saveOldQuantity(this);"> 

変更が行われた後、onChangeイベントが正しく起動しています。 quantityがフォーカスを得ると、変更が行われる前にonfocusの古い値を保存するために、onfocusイベントが適切に起動しています。

validatePart()が無効なpartNumber値を検出した場合、validatePart()はそのことをユーザーに知らせます。 alert()がクリアされたら、partNumber入力にフォーカスを戻したいと思います。しかし、入力ノードでfocus()を実行しても、フォーカスが与えられていません。 IEのデバッグウィンドウのやりとりはもちろん、フォーカスを変更するので、ここではデバッグが難しいです。

validatePart()でエラーが検出された場合、どのようにしてフォーカスをpartNumberに戻すことができますか？

EDIT： validatePart()の単純なバージョン：

function validatePart(node) { 
    if (!node.value) { 
     alert('Please enter a part number.'); 
     node.focus(); // <======= why isn't this having any effect?? 
    } 
} 

Answer 1

小さなタイムアウトを追加し、トリックを行う必要がありますバックpartNumberテキストボックスにフォーカスをリセットします。単にリターンが戻ってpartNumberテキストボックス（も、あなたのタブもオフの場合に焦点を当てる関係なくpartNumberテキストボックスに入力されているものと、正常alertを発射しない

function validatePart(node) { 
    if (!node.value) { 
     alert('Please enter a part number.'); 
     setTimeout(function(){node.focus();}, 1); 
    } 
} 

Here's a quick "live" example：

このように、あなたのvalidatePart()機能は次のようになりquantityテキストボックスに。

Answer 2

あなたのコードは私のために期待どおりに動作するようです。このfiddleを参照してください。あなたは他の行動をしていますか？私はtextbox1に数字を入力することがわかります。その後、私がテキストボックス2にタブオーバーすると、私はInvalid Part!エラーを表示し、フォーカスは現在のテキストボックスにとどまります。

更新 - これはChromeでうまくいくように見えますが、エラーが存在するかどうかを追跡できます。そうなら、それを処理してください。

var error = null; 
function checkForErrors() { 
    if (error) { error.focus(); error = null; }    
} 

function validatePart(node) { 
    if (badpart) { error = node; } 
} 

function saveOldQuantity(node) { 
    checkForErrors(); 
}