今天就来唠唠这个 `*`。这玩意儿我以前确实没少折腾,现在回想起来,还挺有意思的。
最早接触这东西,大概是刚开始自己瞎鼓捣网页那会儿。当时做了个特别简单的留言板,就是个输入框加个提交按钮。每次写完留言,还得老老实实去点那个按钮,觉得特麻烦。
我就想,能不能像聊天软件那样,输完直接敲回车,‘啪’一下就发出去了?这样多爽快。
于是就开始琢磨怎么搞。上网瞎搜呗,搜“JavaScript 键盘 回车”之类的关键词。搜着搜着,就看到有人提到了键盘事件,什么 `keydown`、`keypress`、`keyup`。当时看得一头雾水,感觉都差不多。
关键是,在一些例子里,看到了 `*` 这个属性。看描述说,这玩意儿能拿到你按下的那个键对应的数字代码。我一看,这个好像能行!只要我知道回车键的代码是多少,不就能判断用户是不是按了回车吗?
赶紧再查查回车键的代码是多少。一查,说是 13。行,记住这个数了。
接下来就是动手实践了。我找到那个留言输入框的元素,给它加了个事件监听。一开始我好像用的是 `keypress` 事件,想着“按下去”嘛然后就在事件处理的那个函数里写:
javascript
// 这儿是伪代码,大概是这个意思
function handleKeyPress(event) {
if (* === 13) {
// 如果是回车键
// 就执行那个提交留言的操作
submitMessage();
// 可能还得阻止一下默认的回车换行行为?当时好像也折腾了这个
写完这段,刷新页面,试了一下。在输入框里打了几个字,然后“啪”一敲回车——有时候好使,有时候好像没反应,或者有点怪怪的。具体啥问题记不清了,反正就是没达到预期。
不死心,继续查。看到有人说 `keydown` 事件可能更适合捕获像回车、Shift 这种功能键。行,那就换 `keydown` 试试。
把监听的事件类型从 `keypress` 改成 `keydown`,里面的逻辑基本没动。再试——这回对了!输入文字,敲回车,留言“嗖”地一下就发出去了,页面也没出现多余的换行。当时那个成就感,甭提了。
实践中的小发现
在捣鼓 `*` 的过程中,也发现了一些小细节:
- 不同的按键,`keycode` 的值都不一样。比如字母 A 是 65,数字 1 是 49。当时还特意找了个键盘键码对照表瞅了半天。
- 大写字母和小写字母,`keycode` 好像是一样的,都是那个字母对应的码。但配合 Shift 键按又是另一回事了。
- `keydown` 和 `keypress` 的触发时机和对某些键的响应,好像有点细微差别。具体哪个好用,还得看具体场景试。
虽然现在大家都说 `*` 有点老了,存在一些兼容性问题啥的,推荐用 `*` 或者 `*` 这些更现代、更标准的方法。但在我刚开始学习和实践那会儿,`*` 确实帮我解决了实实在在的问题。它简单直接,让我第一次体会到了通过代码捕捉用户键盘操作的乐趣。
虽然技术一直在更新,但了解一下这些“老家伙”是怎么回事,回顾一下当初自己是怎么一步步把它用起来的,感觉还是挺有收获的。这就是我跟 `*` 打交道的一段经历,分享给大家。