0

私の目標は、同じコンポーネントが常にフォーカスを持っていることを確認することです。フォームには、1つの入力ボックスといくつかのボタンがあります。ユーザーはバーコードをスキャンし（キーボードをエミュレートするスキャナーで）、ボタンを選択して機能をアクティブにします。入力ボックスをクリックしなくても、複数のバーコードをスキャンできるようにしたいと思います。受信トレイを上書きする準備をするという汚い作業を行う次のJavaScriptがあります（現在、フォーカスを受信トレイに移動した場合のみ）。

function SelectAll(id)
    {
        document.getElementById(id).focus();
        document.getElementById(id).select();
    }
    window.onload = SelectAll('form:scan');

入力が妨げられないようにする必要があります（したがって、フォーカスが失われた場合にのみフォーカスを戻す必要があると考えています）。変更とボタンのアクティブ化イベントにフォーカスする機能を追加しようとしましたが、成功しませんでした。ボタンをアクティブにした後、フォーカスがどこか不明になるため、実際にはページ幅を広くする必要があります。

編集

この場合、ぼかしイベントでフォーカスを変更しても機能しないようです。JSFのハンドラーは、blurイベント（したがってフォーカス変更要求）が実行された後にフォーカスを移動するように見えます。JSFの専門家は、純粋なJavaScriptを使用する代わりに、JSFのハンドラーを調べて微調整する方法を知っていますか？

編集

私は途中です。ぼかしイベントが無視された理由は、AJAX呼び出し中に個々のコンポーネントだけでなく、フォーム全体が再レンダリングされることに関係していました。更新範囲を制限すると、入力ボックス自体を除くすべてのコンポーネントで機能します。入力に対していくつかの検証を行うため、入力ボックス自体を再レンダリングする必要があります。再レンダリングを無効にすると、入力時に選択されます。再レンダリングを有効にすると、検証された情報が戻される前に選択コードが実行されます。情報が戻されると、選択が失われます（フォーカスは維持されますが、選択が適切に行われていないと、すぐに再度スキャンすることはできません。どこかをクリックします）。

4

1 に答える 1

1

これを試して、jsfiddleでウィンドウのロードが機能しないことを確認してください

http://jsfiddle.net/jemZT/

var scannerID = document.getElementById("scannerID");
function startFocus(){
    scannerID.focus();
}
if(window.addEventListener){
    window.addEventListener('load',startFocus,false); //W3C
}
else{
    window.attachEvent('onload',startFocus); //IE
}
scannerID.addEventListener("blur", function(e){
    e.target.focus();
});​

また、タグをクリックしてクリップボードにコピーすると簡単にコピーして貼り付けるためのイベントでもあり、コードのコピーと貼り付けのプロセスをより簡単にすることに興味があるかもしれません。

編集：確認済みで動作していますブラウザでこれを試してみましたが、完璧に動作します。

<html>
<body>
<input type="text" id="scannerID" />
<script type="text/javascript">
var scannerID = document.getElementById("scannerID");
if(window.addEventListener){
    window.addEventListener('load',startFocus,false); //W3C
}else{
    window.attachEvent('onload',startFocus); //IE
}
function startFocus(){
    scannerID.focus();
}
scannerID.addEventListener("blur", function(e){
    e.target.focus();
});
</script>
</body>
</html>
于 2012-09-06T13:52:58.970 に答える