微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

JavaScript Konami Code 实现代码_javascript技巧

php中文网
发布： 2016-05-16 18:49:08
原创
1247人浏览过

在 Facebook 上有一个彩蛋：
登录 facebook.com ，点击你首页的任何地方，键盘输入 Up, Up, Down, Down, Left, Right, Left, Right, B, A, Enter 后，再点击页面或滚动一下滚动条，你会发现特殊的变化（如下图），嘿嘿 ^^

Facebook 上有一个彩蛋

玩过“魂斗罗”的朋友，肯定一眼就能看出输入的字符原来就是“魂斗罗”中的“秘技”。其实“秘技”的术语叫 Konami Code，详细见图示：

Konami Code

代码小浣熊
代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

代码小浣熊 51
查看详情 代码小浣熊

那如何用 JavaScript 也在自己的页面上添加一个类似的彩蛋呢？
Abhi 在 《Konami Code on Facebook : How to implement it on your site》 一文中提供了大体思路：

复制代码 代码如下:

var $ = {
enabled: false,
tmp: Array(),
_konamiCode: Array(65,66,39,37,39,37,40,40,38,38),
init: function() {
this.tmp = Array(65,66,39,37,39,37,40,40,38,38);
},
konamiCode: function(e) {
if(!this.enabled) {
var t = this.tmp.pop();
if((e.keyCode-t) == 0) {
if(this.tmp.length == 0) {
this.enabled = true;
}
} else {
this.init();
}
} else {
this.action();
}
},
// Change the action() function to whatever you want to
action: function() {
//alert("Konami Code Activated");
}
}

不过 Abhi 的方法还是冗余了点，Jan Jarfalk 在留言中提供了一个短小精悍的代码：
复制代码 代码如下:

var k=[];
function(e){
k.push(e.keyCode);
if(k.toString().indexOf("38,38,40,40,37,39,37,39,66,65")>=0) {
//alert("Konami Code Activated");
}
相关标签：
javascript

大家都在看：

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：JavaScript 捕获窗口关闭事件_javascript技巧 下一篇：JavaScript 获取事件对象的注意点_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
HTML5 Canvas 高DPI适配与清晰渲染指南：解决模糊与坐标偏移问题 本教程详细阐述如何在HTML5Canvas应用中解决高分辨率屏幕上的图像模糊问题，并确保图形定位准确。文章核心在于利用devicePixelRatio进行Canvas物理像素与CSS像素的适配，并通过调整绘图上下文的缩放，实现清晰渲染。同时，深入探讨了适配后可能出现的坐标系偏移问题及其解决方案，确保图形始终正确居中和定位。
2025-11-13 13:37:03
787
JavaScript DOM 创建：createElement 与 innerHTML 的优劣 createElement适合动态构建交互组件，安全且可控，如创建带事件的节点；innerHTML适用于快速插入静态结构，但存在性能与安全风险，需谨慎使用。
2025-11-13 11:39:56
360
MongoDB索引怎么优化_MongoDB索引原理与JS全栈查询性能优化方法 合理设计MongoDB索引可显著提升查询性能，需遵循“等值-排序-范围”原则创建复合索引，避免冗余；利用覆盖查询减少I/O；结合explain、慢查询日志和indexStats持续监控，确保索引匹配实际查询模式。
2025-11-13 11:27:24
770
JavaScript变量怎么声明_JavaScript变量声明与作用域详解 答案：JavaScript中var声明存在变量提升和函数作用域，易导致意外；let和const具有块级作用域和暂时性死区，推荐使用；避免隐式全局变量，合理利用作用域链可提升代码安全性与可维护性。
2025-11-13 10:05:02
298
js中this的几种用法 this的指向在运行时由函数调用方式决定：1.全局环境中指向window（浏览器）或global（Node.js）；2.普通函数调用时非严格模式指向window，严格模式为undefined；3.作为对象方法调用时指向该对象，但单独引用后调用会丢失绑定；4.构造函数中指向新创建的实例；5.箭头函数无独立this，继承外层作用域的this；6.可通过call、apply、bind显式绑定this指向。关键在于理解调用上下文而非定义位置。
2025-11-13 09:59:40
713
JS插件如何实现页面元素复制功能_JavaScript复制功能插件开发与使用场景教程 答案：通过JavaScript结合DOM操作与剪贴板API实现元素复制。首先利用element.cloneNode或outerHTML获取元素结构，再通过document.execCommand或现代ClipboardAPI写入剪贴板；开发轻量插件可支持多种场景，如内容后台、设计工具等，需注意兼容性与用户触发限制。
2025-11-13 09:57:02
377
js创建对象的几种方式 JavaScript中创建对象有7种方式：1.字面量方式最简单但无法复用；2.newObject()构造函数略显冗长；3.工厂函数可批量创建但实例原型指向Object；4.构造函数配合new创建实例，但方法重复占用内存；5.原型方式共享方法节省内存，但引用属性可能被共用；6.构造函数+原型组合模式兼顾属性独立与方法共享，是标准模式；7.ES6class语法更清晰，支持继承和静态方法，推荐现代开发使用。
2025-11-13 09:15:52
732
JavaScript工厂模式与对象创建 工厂模式通过函数封装对象创建过程，如createUser返回含name、age和greet方法的对象；其优势包括简单性、封装性、可复用性及支持私有变量，例如createCounter利用闭包隐藏count变量；相比构造函数和类，工厂模式更灵活安全，适用于复杂初始化、需隐藏实现细节或避免使用new的场景。
2025-11-12 23:57:02
726
怎样开发一个实时聊天消息插件_JavaScript聊天功能插件开发与WebSocket应用 首先利用WebSocket实现前后端双向通信，通过JavaScript封装可复用模块，核心包括稳定连接管理、心跳机制与自动重连；接着封装消息收发逻辑，统一JSON数据格式并支持类型分发与ACK确认；最后设计灵活接口，提供配置化初始化、生命周期控制及钩子函数，屏蔽底层细节，便于快速集成。
2025-11-12 23:57:02
890
JavaScript虚拟DOM与diff算法 虚拟DOM通过JavaScript对象模拟真实DOM，结合diff算法高效比对新旧节点差异，仅将最小更新应用到真实DOM。利用同层比较、类型判断和key标识，避免全量渲染，提升性能。关键在“先算再改”，实现开发体验与运行效率的平衡。
2025-11-12 23:51:08
876
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部