我正在尝试向计算器添加一个清除按钮。我希望它将数组重置为空，即 storage.length = 0;。但是，我无法让我的 AC key 执行任何操作...我尝试让它发出“嗨”警报，但没有任何作用。我是新手，所以我迷路了。
/* Click on button and have number saved in array for later use*/
var calcKeys = document.querySelectorAll('.num');
var storage = ['1'];
function addClick(node) {
node.addEventListener('click', function(e) {
storage.push(e.target.innerHTML);
console.log(storage);
if(calcKeys.innerHTML === 'AC') {
alert("hi");
/*storage.length = 0;*/
}
});
}
for (var i = 0; i < calcKeys.length; i++) {
addClick(calcKeys[i]);
}
// when user clicks AC button, clear array
// get node by defining AC key
console.log(storage);#calculator{
width: 100%;
height: 100%;
background-color: rgba(0, 0, 255, 0.1);
display: flex;
flex-direction: column;
align-items: center;
padding-top: 10px;
}
.keys {
display: flex;
justify-content: space-around;
width: 100%;
flex-wrap: wrap;
max-width: 250px;
}
.keys span {
padding: 20px;
border-radius: 5px;
margin: 8px;
font: bold 20px Arial, sans-serif;
display: flex;
align-items: center;
background-color: grey;
}
.keys span:nth-child(odd) {
background-color: aqua;
}
.screen {
width: 95%;
height: 40px;
border-radius: 3px;
background-color: #ccc;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<div id="calculator">
<div class="screen"></div>
<div class="keys">
<span class="num">1</span>
<span class="num">2</span>
<span class="num">3</span>
<span class="num">4</span>
<span class="num">5</span>
<span class="num">6</span>
<span class="num">7</span>
<span class="num">8</span>
<span class="num">9</span>
<span class="num">0</span>
<span class="num operator plus">+</span>
<span class="num operator minus">-</span>
<span class="num operator divide">/</span>
<span class="num operator times">*</span>
<span class="num operator ac">AC</span>
</div>
</div>
</head>
<body>
</body>
</html>最佳答案
问题出在这里:
function addClick(node) {
node.addEventListener('click', function(e) {
storage.push(e.target.innerHTML);
console.log(storage);
/* Here */
if(calcKeys.innerHTML === 'AC') {
alert("hi");
/*storage.length = 0;*/
}
});
}
您使用 calcKeys 购买，而不是使用当前 key ，因此您必须纠正这一点:
function addClick(node) {
node.addEventListener('click', function(e) {
storage.push(e.target.innerHTML);
console.log(storage);
if(e.target.innerHTML === 'AC') {
alert("hi");
/*storage.length = 0;*/
}
});
}
关于javascript - 计算器清除按钮，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35026493/