Javascript 计算器

Question

我是初学者，我正在尝试我的第一个真正的项目，制作一个计算器。我有一个模板 HTML 和 CSS，我只想通过编辑 javascript 来让它工作。如果有人能指出我正确的方向，我会陷入困境并感到有点沮丧。

这是一个类似的以前问过的问题（我想我应该在提问时包括这个）：Dynamical Calculator Javascript

到目前为止，这是我的脚本：https://jsfiddle.net/andthatch/an73my86/#&togetherjs=4goj5AV6Qk

现在工作 :) 谢谢大家。如果我再次卡住，我会停下来。

var divElement = document.getElementById("calculator");
var keys = divElement.getElementsByTagName("span");
var input = document.getElementsByClassName('screen');
var decimalAdded = false;

    for (var i = 0; i < keys.length; i++) {
    keys[i].addEventListener('click', function(e) {

        var inputVal = input[0].innerHTML;
        var buttonVal = this.innerHTML;

        if(buttonVal === 'C') {
            input[0].innerHTML = '';
            decimalAdded = false;
        }
        else{
           input[0].innerHTML+=buttonVal;
        }

    });
}

Answer 1

你的脚本有一些错误 file.input是一个元素的集合，因为它是通过getElementsByClassName获得的。所以你必须为class下的唯一元素指定索引'screen' 作为返回数组。也使用 addEventListener 而不是使用 'onClick' 作为对象

上的属性

var divElement = document.getElementById("calculator");
var keys = divElement.getElementsByTagName("span");
var input = divElement.getElementsByClassName("screen");
var decimalAdded = false;

for (var i = 0; i < keys.length; i++) {
    keys[i].addEventListener('click', function(e) {

        var inputVal = input[0].innerHTML;
        var buttonVal = this.innerHTML;

        if(buttonVal === 'C') {
            input[0].innerHTML = '';
            decimalAdded = false;
        }else{
           input[0].innerHTML+=buttonVal;
        }

    });
}

Javascript 计算器

Javascript Calculator

javascript

calculator