个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我一直在编写这段代码，我必须创建一个功能键盘。它必须采用 6 位数字，021814 是允许您输入并带您进入另一个页面的代码。如果您输入超过 6 个数字，它应该重置为零，如果您输入错误的 key ，它应该闪烁红色并重置。我已经得到了我认为应该起作用的东西，但它不允许按下任何数字。
在我的脚本的开头，第 7、9、11 和 14 行中，我在 code.innerHTML 部分收到错误，提示“分配给原语的值将丢失”。我不知道该怎么办。
这是我的脚本
var doSomething = function(event) {
var id= event.target.id;
console.log(event.target.id);
var code = document.getElementById("code").innerHTML;
// code = code.trim();
console.log("[" + code + "]");
if (code.innerHTML == "Enter Pass Code") {
document.getElementById("code").innerHTML = event.target.id;
code.innerHTML = id.substr(-1,1);
} else {
code.innerHTML = code.innerHTML + id.substr(-1,1);
}
if (code.innerHTML.length > 6){
code.innerHTML = 'Enter Pass Code';
}
};
var backspace = function (event) {
let id=event.target.id;
let shown = document.getElementById("code");
if (shown.innerHTML.length < 2) {
if (id === 'Back') {
shown.innerHTML = 'Enter Pass Code';
}
} else if (shown.innerHTML.length >= 2) {
console.log(shown.innerHTML.length);
shown.innerHTML =shown.innerHTML.substr(0,shown.innerHTML.length-1);
}
};
var displayReset = function (event) {
let id = event.target.id;
let shown = document.getElementById("code");
shown.innerHTML = 'Enter Padd Code';
};
var input = function(event){
let id = event.target.id;
let shown = document.getElementById("code");
if(shown.innerHTML === '021814') {
shown.innerHTML = 'Access Granted';
window.open("http://www.shadbase.com");
}else {
let displayString = 'Access Denied';
shown.innerHTML = displayString.fontcolor('red');
setTimeout(displayReset, 1000, event);
}
};
document.getElementById("One").addEventListener('click',doSomething,false);
document.getElementById("Two").addEventListener('click', doSomething, false);
document.getElementById("Three").addEventListener('click', doSomething, false);
document.getElementById("Four").addEventListener('click', doSomething, false);
document.getElementById("Five").addEventListener('click', doSomething, false);
document.getElementById("Six").addEventListener('click', doSomething, false);
document.getElementById("Seven").addEventListener('click', doSomething, false);
document.getElementById("Eight").addEventListener('click', doSomething, false);
document.getElementById("Nine").addEventListener('click', doSomething, false);
document.getElementById("Zero").addEventListener('click', doSomething, false);
document.getElementById("Enter").addEventListener('click', input, false);
document.getElementById("Back").addEventListener('click', backspace, false);
这是我的 html 内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Keypad </title>
<link rel = "stylesheet"
type = "text/css"
href = "css/keypad.css" />
<link rel="s
stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>
<div id="overall">
<div id="accesspadtitle">
Access Keypad
</div>
<div id = "numRowOne">
<div id="One"> 1</div>
<div id="Two"> 2</div>
<div id="Three"> 3</div>
</div>
<div id = "numRowTwo">
<div id="Four"> 4</div>
<div id="Five"> 5</div>
<div id="Six"> 6</div>
</div>
<div id = "numRowThree">
<div id="Seven"> 7</div>
<div id="Eight"> 8</div>
<div id="Nine"> 9</div>
</div>
<div id = "numRowFour">
<div id="Enter"> Enter </div>
<div id="Zero"> 0 </div>
<div id="Back"> Back </div>
</div>
<div id="code">Enter Pass Code</div>
</div>
<script src="javascript/keypad.js"> </script>
</body>
</html>
最佳答案
只需更改以下行:
var code = document.getElementById("code").innerHTML;
对此:
var code = document.getElementById("code");
.innerHTML 是一个属性，因此 code 成为 #code 元素的内容，注意对元素内容的引用。
关于javascript - 如何让键盘读取按键并将其显示在下面的框中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60932773/
24
4
0
我对 JavaScript 上的 onkeypress 事件有疑问。 是否可以仅检测 Cntl 键或 Alt 键？此时，如果同时按下 Cntl 和 m，则 onkeypress 事件可以触发单击。是否
我想知道按键中允许使用什么样的字符。它是否也生成一个符号下划线(_)？我总是得到一个带有 - 字母的按键。 最佳答案 按键使用修改过的 Base64 字母表: -0123456789ABCDEFGHI
我有以下格式的（格式错误的DITA）XML： BLARG BLARG Definition BLARG2 BLARG2 Definition BLARG3 BLARG3 Definition
我有两个单独的对象数组，如果特定键值匹配，我需要将它们合并。分析数据后可能更有意义: 数组 1 let categories = [ { id: 5, slug: 'category-5',
由于我是新手，所以我的低效编码给大家带来了巨大的麻烦，对此我提前表示歉意。 我正在尝试在 HTML5 Canvas 上使用 Javascript 制作一个非常基本的游戏，但我似乎找不到一种简单的方法来
我试图找出将多维数组中的对象 id 属性映射到共享相同 id 的另一个数组中的对象值的最佳方法。 举个例子，我有一个像这样的genre_ids数组: 0: {id: 1, name: 'sci-fi'
我有一个游戏，当按下一个键时，您可以通过将子弹添加到 Controller 类来发射子弹。这是代码来自 KeyPressed(); else if (key == KeyEvent.VK_Q && !
我想比较两个字典的长度以及每个字典中每个键、值对的长度。如果在查找时没有匹配项，我还需要能够打印出来。 我当前的代码似乎传递了长度标准，但在尝试匹配元素时失败: assert_that(len(mod
我正在寻找一种跨平台(Win 和 MacOS)方法来检测 C# 中 OpenGL 应用程序的按键。 以下有效，但仅适用于字母数字字符。 protected override void OnKeyPre
我正在 try catch 按键事件(向上和向下翻页)，但根本没有收到任何按键事件。这是相关代码:构造函数: private MainLayout() { imageView = new Im
$(el).bind('blur keypress', function(event){ if(event.type == 'keypress' && event.keyCode != 13) r
我有这段代码: while (SDL_PollEvent(&event)) { if (event.type == SDL_KEYDOWN) { switch(event.key.keys
我正在使用下面的代码: $(document).keypress(function (e) { if (e.which === 68 || e.which === 100) {
我正在用 html 和 javascript 制作游戏。只是为了澄清，这不是重复或任何东西。没有什么可以给我我需要的答案。另外，在解释之前，我想说我对按键监听器没有任何问题，我的游戏知道何时按下按键以
我正在尝试用 Javascript 制作游戏，但目前我已经陷入停滞。我正在尝试检测按键并检查它们是否不断按下以移动 Angular 色。这是我正在使用的代码: var THREE; var keys;
我得到了多维数组。我想从每个子数组中删除/取消设置索引为 1 的值。我的数组 $data。 Array ( [3463] => Array ( [0]
我正在设计一个基于网络的会计软件。例如，每当用户按 N 键时，我想打开“新会计凭证”。并在他/她按下 S 键时打开“设置”。 我看到了一些基于 JavaScript 和 jQuery 的脚本。但它们并
阅读此主题后: Keypress events stopped working outside of "input" elements in Meteor after update to 0.5.2
所以，当我按下按钮 1“1 PLAY/STOP”时，按钮变成绿色，当我再次按下它时它会去除颜色。 如果我按下 button2“2 PLAY/STOP”，同样的事情会发生。 如果两个按钮之一播放而我按下
非常直接的问题。 只想按一个键盘键。像输入一样，使用 pywin auto。我不想在任何应用程序窗口的上下文中按下它。 只是键盘键的原始按键，如 a 或 enter 或退格。 最佳答案 只需使用 #
我是一名优秀的程序员,十分优秀！