3

HTML本文にテキストボックスがあります：input type="text" id="text-input"

ユーザーがEnterキーを押したときにフォーカスを合わせるためにこれを使用しています：

<script>
    $(document).keypress(function(e) {
        if(e.keyCode == 13) {
            $("#text-input").focus();
        }
    });
</script>

試しに使用している Web ページには、テキスト ボックスしかありません。空白の領域をクリックして Enter キーを押すと、「|」プロンプトが下にずれます。このクリックとエンターを繰り返すと、テキストボックスにあるはずの「|」がどんどん下に移動していきます。

何が悪かったのか？

4

2 に答える 2

1

keyupの代わりに使用してみてくださいkeypress

$(document).keyup(function(e) {
    if(e.keyCode == 13) {
        $("#text-input").focus();
    }
});​

例: キープレスとキーアップ

クロムでテストされ、結果は異なります。

注: keypress=(keydown および keyup 2イベント)。これが問題かもしれませんが、確かではありません。

于 2012-04-27T17:32:36.347 に答える
1

false を返すと動作が修正されることがわかりました。

$(document).keypress(function(e) 
{
    if(e.keyCode === 13) 
    {
        $("#text-input").focus();

        return false;
    }
});​

これを改善するには、このハンドラーがヒットすると、意図したこと以外は何も起こらないようにする代わりに、 e.preventDefault();andの組み合わせを実際に使用できます。e.stopImmediatePropagation();return false;.focus()

$(document).keypress(function(e) 
{
    if (e.keyCode === 13) 
    {
        $("#text-input").focus();

        e.preventDefault();
        e.stopImmediatePropagation();
    }
});

唯一の注意点は、コード内でこのハンドラーの後にe.stopImmediatePropagation();定義されたイベント ハンドラーに対してのみ機能することです。つまり、 の前にドキュメントのキープレスに別のハンドラーがバインドされていた場合、それはヒットし続けます。したがって、これとこれだけが呼び出されるようにするには、それがコードで定義された最初のハンドラーであることを確認する必要があります。.focus()

ここで例を見てください

于 2012-04-27T17:33:55.753 に答える