jQueryのおまじない$(function)({});に関する質問

Question

htmlのformがエンターキーでsubmitされることを防ぐため、以下の様なコードを書きました。

$(function(){
    $('input').keydown(function(e) {
        if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) {
            return false;
        } else {
            return true;
        }
    });

    $('select').keydown(function(e) {
        if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) {
            return false;
        } else {
            return true;
        }
    });
});

しかし、これではselectにフォーカスがあるときにエンターを押すと、submitされてしまいました。
(inputではエンターキーをブロックしました)

---

一方、以下のようにすると(別々におまじないをかける)
selectでもちゃんとエンターキーの入力をブロックしてくれました。

$(function(){
    $('input').keydown(function(e) {
        if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) {
            return false;
        } else {
            return true;
        }
    });
});

$(function(){
    $(’select').keydown(function(e) {
        if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) {
            return false;
        } else {
            return true;
        }
    });
});

---

なぜこのような事になるのでしょうか？
どちらもコードの意味は同じだと思うのですが、、

ご教授の程よろしくお願いします。

Comments

[退会済みユーザー]

2つ目のコードブロックの部分$(’select')に全角文字が入っていますがtypoでしょうか？

Answer 1

1つ目のコードのreturn false;の直線でそれぞれconsole.logして動作を確認してみたのですが、
chrome/IE11ではinputもselectも動作していました。(jquery 2.2.3)
動作確認はどのブラウザで行いましたか？

chrome or IE11の場合は一度1つ目のコードで再現性を確認してみていただけますか

Comments

[noisy_max]

本日再び試したところ、正常に動作しました…
本当に申し訳ないです。 ご回答有り難うございました。

Answer 2

両者での違いは、イベントオブジェクトのスコープかもしれません。
一つ目の書き方では、どちらも同じイベントオブジェクトを指しており、誤動作につながっている気がします。
試してもいない予測ですいませんが・・・

selectの方をeではなくseなどに変更してもダメでしょうか？

Comments

[noisy_max]

前者のコードでも正常に動作しました。きちんと確認せず質問してしまい申し訳ないです。
イベントオブジェクトの点のご指摘ありがとうございます。以後の開発では気をつけたいと思います。
ご回答有り難うございました。