使用require.js和jQuery$（document.ready（）在输入元素中正确地键入事件处理

我以前有过这个代码

：

require（['lvrg'，'jquery'，'jquery.i18n'，'purl']，函数（lvrg，$）{
$（“#边栏包装”）.load（“/menu”）；
$（“#菜单切换”）。单击（功能（e）{
e、 预防默认值（）；
$（“#包装器”）.toggleClass（“toggled”）；
});
$（文档）.ready（函数（）{
var menuOptions=$（'a.menu-option'）；
log（“菜单选项：”，菜单选项）；
$（'input#search option'）。打开（'keydown'，函数（e）{
console.log（'e:'，e）；
});
});
});

这是DOM中的

问题是，这个片段根本不起作用：

$（'input#search option'）。在（'keydown'，函数（e）{console.log（'e:'，e）；}）上
我不知道为什么

当文档准备就绪时，控制台中会出现菜单选项，以及它的所有值

即使我将方法从
on（）
更改为
keypress（）
，
keypup（）
或
keypdown（）
，键盘输入事件处理也无法工作

但是当我粘贴一些用于键盘事件处理的代码时，例如，
$（'input#search option'）。on（'keyup'，function（e）{console.log（'e:'，e）；}）进入devtools控制台并点击回车键，在网站上时，代码真正处理输入，因为我可以在控制台
e:m.Event{originalEvent:KeyboardEvent，键入：“keyup”，时间戳：1447074756199，jquery113059499042285856:true，keyCode:53…}VM4184:2

我正在Opera 33.0.1990.58上测试这段代码，但在Firefox 42和IE 11上得到了相同的效果。我使用的是64位Windows7

有人知道这为什么不能正常工作吗？
您使用的是两个不同的选择器<代码>a.菜单选项
和
输入#搜索选项
。从您的调试来看，
input#search option
似乎不在就绪时的DOM中，但
a.menu-option
是。试试
$（document）.在（'keydown'，'input#search option'，function（）{/**/}）
上，我在
中得到的脚本是：squel-4.2.1.min.js，jquery.i18n-1.0.3.js，purl-2.3.1.js，moment-2.10.6.min.js，下划线-1.8.3-min.js，jquery-ui-1.11.min.js，选择2-3.5.4.min.js和bootstrap-3.3.5.min。js@Matt与两个选择器相关的元素都在DOM中加载。它们可以在浏览器的视图中看到，也可以在devtools的元素中看到。我将尝试您的建议并回答它是否有效。好的，因此使用了此代码
$（this）.on（'keypress'，'input#search term'，function（e）{console.log（'e:'，e）；}）
而不是
$（'input#search option'）。on（'keydown'，function（e）{console.log（'e:'，e）；}）
并在Opera 33.0.1990.58、Chrome 46.0.2490.80M（匿名窗口）、Firefox 42和IE 11上进行了测试，最终成功了！但仍然不知道为什么早期的代码不起作用。。无论如何，非常感谢你@Matt如果没有你的帮助，我会花很多时间来解决这个问题。您是如何知道我应该首先将
on（）
事件处理程序绑定到
$（文档）
的？spaffy：如果事件处理程序没有连接自身，99%的情况会被1）选择器输入错误，或者2）调用
on（）
时元素不在DOM中。通过使用
$（document）.on（…）
，您将事件处理程序附加到
文档（始终存在）而不是特定元素；因此，这是一种非常快速/可靠的确定问题是否由DOM中的元素引起的方法。
<script>
    require(['lvrg', 'jquery', 'jquery.i18n', 'purl'], function (lvrg, $) {
      $('#sidebar-wrapper').load('/menu');
      $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
      });
      $(document).ready(function() {
        var menuOptions = $('a.menu-option');
        console.log("menuOptions:", menuOptions);
        $('input#search-option').on('keydown', function(e) {
          console.log('e:', e);
        });
      });
    });
</script>