水·系列 怎么在 div 上应用 onkeydown?

June 18, 2019coding技术水

最近给公司后台写思维导图插件忙成狗,偷闲上来水一下。

这个问题也是做思维导图的时候遇到的:

在 input 框上谁都知道可以绑定 keydown,但是对于一个不是编辑状态的 div 怎么办呢?直接绑在 document?

不行,在 document 绑定 keydown 会对普通输入造成麻烦,也有可能会干扰其他库,那么怎么在某个 div 上应用 keydown 呢?

<div id="myDiv" tabindex="0">Press me and start typing</div>

答案是:只要加上 tabindex="0",这个 div 就会变成“可 focus”的状态。

#myDiv {
  outline: none;
}

选中时的外边框可以通过 css 隐藏。

水完,继续肝代码。

解决方案来源:https://stackoverflow.com/questions/3149362/capture-key-press-or-keydown-event-on-div-element


暂时没有留言,要抢沙发吗?
留言