How to grab keyboard events on an element which doesn#39;t accept focus?(如何在不接受焦点的元素上获取键盘事件?)
问题描述
我知道要处理输入字段中的键盘事件,您可以使用:
I know that for handling keyboard events in an input field you can use:
$('input').keyup(function(e){
var code = e.keyCode // and 13 is the keyCode for Enter
});
但是,现在,我有一些 div
和 li
元素,我没有 form
元素,我的也没有元素被认为是表单元素,它们都不接受 focus 或 tab 之类的东西.
But, now, I have some div
and li
elements, and I don't have a form
element, and none of my elements are considered to be form elements and none of them accept focus or tab and stuff like that.
但现在我需要处理 div 元素中的 keyup
(或 keydown
或 keypress
无关紧要)事件.我试过了:
But now I need to handle the keyup
(or keydown
, or keypress
, doesn't matter) event in a div element. I tried:
$('div#modal').keyup(function(e){
if (e.keyCode == 13)
{
$('#next').click(); // Mimicking mouse click to go to the next level.
}
});
但问题是,它不起作用.我该怎么办?
But the problem is, it doesn't work. What should I do?
推荐答案
一个div
默认无法获得焦点.但是,您可以通过将 tabindex
属性添加到 div
来更改它:
A div
by default cannot be given focus. However, you can change that by adding a tabindex
attribute to the div
:
<div tabindex="0" id="example"></div>
然后你可以给 div
焦点,也可以用 hover
事件来模糊它:
You can then give the div
focus, and also blur it with the hover
event:
$("#example").hover(function() {
this.focus();
}, function() {
this.blur();
}).keydown(function(e) {
alert(e.keyCode);
});
当 div
有焦点时,它将接受键盘事件.您可以在此处查看此工作的示例.
When the div
has focus, it will accept keyboard events. You can see an example of this working here.
这篇关于如何在不接受焦点的元素上获取键盘事件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:如何在不接受焦点的元素上获取键盘事件?
- Flexslider 箭头未正确显示 2022-01-01
- Quasar 2+Apollo:错误:找不到ID为默认的Apollo客户端。如果您在组件设置之外,请使用ProvideApolloClient() 2022-01-01
- Fetch API 如何获取响应体? 2022-01-01
- 使用RSelum从网站(报纸档案)中抓取多个网页 2022-09-06
- 失败的 Canvas 360 jquery 插件 2022-01-01
- CSS媒体查询(最大高度)不起作用,但为什么? 2022-01-01
- 如何使用 JSON 格式的 jQuery AJAX 从 .cfm 页面输出查 2022-01-01
- 400或500级别的HTTP响应 2022-01-01
- addEventListener 在 IE 11 中不起作用 2022-01-01
- Css:将嵌套元素定位在父元素边界之外一点 2022-09-07