我正在使用 HTML、CSS 和纯 JavaScript 构建一个计算器。 我试着用很少的信息来做这件事，但我不明白现在发生了什么。由于一个人键入许多数字(即 456)来创建一个数字，然后单击运算符，我决定创建一个数组(arrayInput)来保存数字 4、5、6 甚至字符“。”因此，例如数组中的 4.56 显示为 4,.,5,6 所以我删除了字符，然后删除了空格。最后，因为它现在是一个字符串“4.56”，所以我使用 Number() 函数将其转换为数字。我也用过parseInt, parseFloat，但是只显示第一次，选择运算符后，不计算总和，总和为零。感谢您的支持。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<style type='text/css'>
.row{
height: 2em;
width: 25%;
border: 0.05em solid black;
float:left;
font-size: 2em;
font-style: sans-serif;
text-align:center;
padding:0;
}
#screen{
height: 4em;
width: 100%;
border: 0.03em solid black;
float:left;
font-size: 3em;
font-style: sans-serif;
text-align:right;
margin:0;
padding:0;
}
</style>
<script type='text/javascript'>
var total=0; //which will replace the number1 in parameters
var numberArray=[];
var operator="plus"; //by default i give it an addition
var number=0;
//get digits from buttons to create the number you want to use
var performOperator=function (tot,num,ope){
if(ope==="plus")
{
tot+=num;
num=0;
document.getElementById("screen").innerHTML = tot; //display a number of total HOPEFULLY
}
else if(ope==="-")
{
tot-=num;
num=0;
document.getElementById("screen").innerHTML = tot; //display a number of total HOPEFULLY
}
else if(ope==="multiply")
{
tot*=num;
num=0;
document.getElementById("screen").innerHTML = tot; //display a number of total HOPEFULLY
}
else if(ope==="/")
{
tot/=num;
num=0;
document.getElementById("screen").innerHTML = tot; //display a number of total HOPEFULLY
}
else if(ope==="equal")
{
document.getElementById("screen").innerHTML = tot; //display a number of last total HOPEFULLY
num=0;
}
else if(ope==="clear")
{
tot=0;
num=0;
document.getElementById("screen").innerHTML = tot; //display a number of total HOPEFULLY
}
}
function getDigit(elemId){
var digitEntry=document.getElementById(elemId).value; //digit value goes to "val"
numberArray.push(digitEntry); //each val should go to push into an array
var numberWithSpace=numberArray.join(' '); //convert the array into a string block with spaces
var numberNoSpace=numberWithSpace.replace(/\s/g, ''); //string number with no space
number=Number(numberNoSpace);// it should be converter into a number here but does not look like..
document.getElementById("screen").innerHTML = number; //probably displays array of Number as STRING
}
function highlightSign(elemId){
var sign=document.getElementById(elemId).value; //digit value goes to "sign""
operator=sign;
performOperator(total,number,operator); //Call the performOperator function and creates new total and new number 0
numberArray=[]; //once the number is created as real number then the array used to built it clears
}
</script>
</head>
<body>
<body>
<p id="screen"></p>
<button id="nC" class="row" value=""></button>
<button id="pmSign" class="row" value=""></button>
<button id="nPercentage" class="row" value=""></button>
<button id="divide" class="row" value="/" onclick="highlightSign(this.id)">/</button>
<button id="n7" class="row" value=7 onclick="getDigit(this.id)">7</button>
<button id="n8" class="row" value=8 onclick="getDigit(this.id)">8</button>
<button id="n9" class="row" value=9 onclick="getDigit(this.id)">9</button>
<button id="opX" class="row" value="multiply" onclick="highlightSign(this.id)">x</button>
<button id="n4" class="row" value=4 onclick="getDigit(this.id)">4</button>
<button id="n5" class="row" value=5 onclick="getDigit(this.id)">5</button>
<button id="n6" class="row" value=6 onclick="getDigit(this.id)">6</button>
<button id="minus" class="row" value="-" onclick="highlightSign(this.id)">-</button>
<button id="n1" class="row" value=1 onclick="getDigit(this.id)">1</button>
<button id="n2" class="row" value=2 onclick="getDigit(this.id)">2</button>
<button id="n3" class="row" value=3 onclick="getDigit(this.id)">3</button>
<button id="plus" class="row" value="plus" onclick="highlightSign(this.id)">+</button>
<button id="n0" class="row" value=0 onclick="getDigit(this.id)">0</button>
<button id="clear" class="row" value="clear" onclick="highlightSign(this.id)">clear</button>
<button id="decPoint" class="row" value="." onclick="getDigit(this.id)">.</button>
<button id="equal" class="row" value="equal" onclick="highlightSign(this.id)">=</button>
</body>
</body>
</html>
最佳答案
我在这里做了你的全部工作。但是您需要更改计算器的逻辑。那里有很多变化
http://jsfiddle.net/g6gj1kr6/9/
不要将总计作为参数传递，只需将其设为全局即可，然后您可以重写它。
var tot=0;
不管怎样，你的计算器还有很多工作要做
关于javascript - 数组转换成字符串用于转换成数字但不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30250359/