1

「Enter」キーの押下を簡単に検出して正しく処理する次のサンプルがあります。ここにあります:

<!DOCTYPE html>
<html>
<head>
    <title>keyCode example</title>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        $(document).ready(function () {

            $("#search-input").keyup(function (event) {
                event = event || window.event;
                if (event.keyCode == 13 || event.which == 13) {
                    $("#search-button").click();
                }
            });

            $("#search-button").click(function () {
                var theUrl = "http://www.yahoo.com/"
                window.location = theUrl;
            });
        });
    </script>
</head>

<body>
    <input id="search-input" name="search" type="text"/>
    <button id="search-button" type="button" alt="Search">Search</button>
</body>
</html>

これは、すべての一般的なブラウザーで実際に機能します。問題は、Firefox 以外のどのブラウザーでも、このコードが本番環境で機能しないことです。私の運用環境では、スクリプトも関数に組み込まれており$(document).ready、別の「main.js」ファイルに配置されています。デバッグ モードでは、テキスト フィールドに文字または数字を入力すると、スクリプトが正しく実行されていることがわかりました。「Enter」キーを押しても、プログラムは$("#search-input").keyup(function (event){セクションにさえ入りません。しかし、テキストフィールドからテキストが消え、ページがリロードされたようです。もう一度繰り返しますが、この問題は本番サイトでしか再現できません。上に示した別のローカル ページでは、すべて正常に動作します。

誰が問題が何であるか知っていますか?

更新:Enterを除くすべてのキーは正常に処理されています。Enter キーを押し$("#search-input").keyup(function (event){ても、イベントが発生しなかったように実行されません。

4

1 に答える 1

1

この問題は、「Enter」キーの押下を処理する次のコードを使用して解決されます。

$("#search-button").on('click', function () {
    var theUrl = "/search.aspx?search=" + $('#search-input').val();
    window.location = theUrl;
});
$('#search-input').on('keyup', function (e) {
    if (e.which == 13)
        $("#search-button").trigger('click');
});

このコードは関数に組み込まれてい$(document).readyます。

于 2013-02-24T12:01:43.487 に答える