12、暗号：键盘输入匹配

最新推荐文章于 2024-05-16 15:56:25 发布

弱鸡如我

最新推荐文章于 2024-05-16 15:56:25 发布

阅读量651

点赞数

分类专栏：原生JavaScript练习

本文链接：https://blog.csdn.net/qq_37152533/article/details/108514717

版权

原生JavaScript练习专栏收录该内容

18 篇文章 0 订阅

订阅专栏

效果

在这里插入图片描述

代码

从 Cornify.com 加载一个 JS 文件，调用其中的 cornify_add() 方法时，会在页面中追加 p 标签，并在 DOM 中插入一个图标。

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Key Detection</title>
  <script type="text/javascript" src="http://www.cornify.com/js/cornify.js"></script>
</head>

<body>
  <h1>输入暗号</h1>
  <script>
    const pressed = [],
      secretCode = 'hello';
    window.addEventListener('keyup', (e) => {
      console.log(e.key);
      pressed.push(e.key);

      /*
      start: 如果负数的绝对值大于数组的长度，则表示开始位置为第0位。
      deleteCount:是 0 或者负数，则不移除元素。这种情况下，至少应添加一个新元素。
      */
      // pressed.splice(-secretCode.length - 1, pressed.length - secretCode.length); //截取数组
      // pressed.splice(0, pressed.length - secretCode.length); //截取数组
      pressed.length > secretCode.length ? pressed.shift() : '';

      if (pressed.join('').includes(secretCode)) { //判断是否符合暗号
        console.log('DING DING!');
        cornify_add();
      }
      console.log(pressed);
    })
  </script>
</body>

</html>

弱鸡如我

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
12、暗号：键盘输入匹配

效果代码从 Cornify.com 加载一个 JS 文件，调用其中的 cornify_add() 方法时，会在页面中追加 p 标签，并在 DOM 中插入一个图标。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Key Detection</title> <script type="text/javascript" sr
复制链接

扫一扫

专栏目录