我正在努力创建一个更易于访问的导航,特别是想使用确定是否使用按键。虽然我想弄清楚为什么这对我不起作用,但我也想知道执行相同操作的几种方法之间的区别。这些方法是:
$('ul li a').on('keypress', function(e){...});
& $('ul li a').keypress(function(e) {...});
& $('ul li a').bind('keypress', function(e) {...});
如果有的话,有什么区别吗?对于这种情况是否有“正确”的使用方法?不管怎样,他们都没有真正为我工作。我在我编写的整个脚本中设置了控制台日志,当控制台记录脚本加载时,它会检测到按键按下,但是它不会检测到按下的返回键,整个脚本如下所示:
$('ul li a').on('keypress', function(e){
if(e.keyCode==13){ // return / enter key
console.log("Return Key Pressed");
}
return false;
});
谢谢!
** 编辑 **
我从来没有发现为什么返回键(或向下箭头)不起作用,也不会触发控制台中的 keydown 事件,但我确实发现空格键是可访问性的最佳方法,最终结果如下:
$('ul li a').on('keypress', function(e){
if ((e.keyCode || e.which) == 32) { // spacebar
... script ...
return false;
}
});
最佳答案
在内部,
.bind
直接映射到当前版本的 jQuery 中的.on
。 (.live
也是如此。)因此,如果您使用.bind
代替,则会产生微小但实际上微不足道的性能影响。但是,
.bind
可能随时从 future 版本中删除。没有理由继续使用.bind
,而完全有理由选择.on
。
如果你查看$.fn.bind
的源代码,你会发现它只是on
的重写函数:
function (types, data, fn) {
return this.on(types, null, data, fn);
}
对于
keypress
功能,我不推荐它,因为它仅适用于现有元素;如果运行keypress
后元素仍存在,则不会处理新元素。您可以使用
委托(delegate)
:$(document).delegate('ul li a','keypress',function(event){ //........ })
关于javascript - JS/JQuery 关于按键的正确使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37282243/