javascript - 为什么我的 JavaScript 计算器一直输出 0?

标签 javascript html

无论操作是什么,我的 JS 计算器一直输出 0。我已经多次检查控制台但没有任何错误,我还检查了我的变量是否是函数但没有。我不确定是否有任何变量与自身交叉引用。我是 JavaScript 的新手。

我的计算器:

var firstNo = 0;
var secondNo = 0;
var currentNo = 0;
var addedNo = 0;

function updateDisplay(nos) {

var screenn = document.getElementById('display');
var scdata = document.getElementById('display').innerHTML;

String(nos);
String(scdata);

screenn.innerHTML = scdata + nos;
if (currentNo==0) {


addedNo = String(firstNo);

addedNo = addedNo + nos;

firstNo = Number(addedNo);

}if (currentNo==1) {

addedNo = String(secondNo);

addedNo = addedNo + nos;

secondNo = Number(addedNo);


}	

}

function clearScreen() {
	
document.getElementById('display').innerHTML = "";
firstNo = 0;
secondNo = 0;
currentNo = 0;
	
}

function setOperator(opo) {
	
var operator = opo;
currentNo = currentNo + 1;	
document.getElementById('display').innerHTML = "";
	
}

function calculate() {
	
if (operator="+") {
	
document.getElementById('display').innerHTML = firstNo + secondNo;
firstNo = 0;
secondNo = 0;
currentNo = 0; 	
	
}if (operator="*") {
	
document.getElementById('display').innerHTML = firstNo * secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}if (operator="/") {
	
document.getElementById('display').innerHTML = firstNo / secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}if (operator="-") {
	
document.getElementById('display').innerHTML = firstNo - secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}
	
	
}
#keypad {
  display: table;
}

.row {
  display: table-row;
}

#display {
  background-color: yellow;
}
<body>
  <h1 id='display'></h1>
  <div id='keypad'>
    <div class='row'>
      <button onclick='updateDisplay(1)'>1</button>
      <button onclick='updateDisplay(2)'>2</button>
      <button onclick='updateDisplay(3)'>3</button>
      <button onclick='setOperator("+")'>+</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(4)'>4</button>
      <button onclick='updateDisplay(5)'>5</button>
      <button onclick='updateDisplay(6)'>6</button>
      <button onclick='setOperator("-")'>-</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(7)'>7</button>
      <button onclick='updateDisplay(8)'>8</button>
      <button onclick='updateDisplay(9)'>9</button>
      <button onclick='setOperator("/")'>/</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(".")'>.</button>
      <button onclick='updateDisplay(0)'>0</button>
      <button onclick='clearScreen()'>X</button>
      <button onclick='setOperator("*")'>*</button>
    </div>
    <div class='row'>
      <button onclick='calculate()'>=</button>
    </div>
  </div>
</body>

如有任何帮助,我们将不胜感激。

最佳答案

试试这个修复: - 你需要把 var operator= ""放在主脚本的顶部。 - 您需要将 if(operator={yourOperator}) 更改为 if(operator=={yourOperator})

注意:您犯了一个语法/逻辑错误,即使用“=”而不是“==”或“===”创建一个语法/逻辑错误,另一个逻辑错误使 var“operator”成为本地变量。 下次将“使用严格”放在脚本的顶部;这应该会揭示一些语法错误,就像你的“if(operator="+")”

var firstNo = 0;
var secondNo = 0;
var currentNo = 0;
var addedNo = 0;
//FIRST CHANGE
var operator= ""

function updateDisplay(nos) {

var screenn = document.getElementById('display');
var scdata = document.getElementById('display').innerHTML;

String(nos);
String(scdata);

screenn.innerHTML =scdata + nos;
if (currentNo==0) {


addedNo = String(firstNo);

addedNo = addedNo + nos;

firstNo = Number(addedNo);

}if (currentNo==1) {

addedNo = String(secondNo);

addedNo = addedNo + nos;

secondNo = Number(addedNo);


}	

}

function clearScreen() {
	
document.getElementById('display').innerHTML = "";
firstNo = 0;
secondNo = 0;
currentNo = 0;
	
}

function setOperator(opo) {
//SECOND CHANGE
operator = opo;

currentNo = currentNo + 1;	
document.getElementById('display').innerHTML = "";
	
}



function calculate() {
   //THIRD CHANGE
if (operator =="+") {
	
document.getElementById('display').innerHTML = parseFloat(firstNo) + parseFloat(secondNo);
console.log(firstNo)
firstNo = 0;
secondNo = 0;
currentNo = 0; 	
	
}
  //FORTH CHANGE
if (operator =="*") {
	
document.getElementById('display').innerHTML = firstNo * secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}
  //FITH CHANGE
if (operator =="/") {
	
document.getElementById('display').innerHTML = firstNo / secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}
   //SIXTH CHANGE
   if (operator =="-") {
	
document.getElementById('display').innerHTML = firstNo - secondNo;	
firstNo = 0;
secondNo = 0;
currentNo = 0; 
	
}
	
	
}
#keypad {
  display: table;
}

.row {
  display: table-row;
}

#display {
  background-color: yellow;
}
<body>
  <h1 id='display'></h1>
  <div id='keypad'>
    <div class='row'>
      <button onclick='updateDisplay(1)'>1</button>
      <button onclick='updateDisplay(2)'>2</button>
      <button onclick='updateDisplay(3)'>3</button>
      <button onclick='setOperator("+")'>+</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(4)'>4</button>
      <button onclick='updateDisplay(5)'>5</button>
      <button onclick='updateDisplay(6)'>6</button>
      <button onclick='setOperator("-")'>-</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(7)'>7</button>
      <button onclick='updateDisplay(8)'>8</button>
      <button onclick='updateDisplay(9)'>9</button>
      <button onclick='setOperator("/")'>/</button>
    </div>
    <div class='row'>
      <button onclick='updateDisplay(".")'>.</button>
      <button onclick='updateDisplay(0)'>0</button>
      <button onclick='clearScreen()'>X</button>
      <button onclick='setOperator("*")'>*</button>
    </div>
    <div class='row'>
      <button onclick='calculate()'>=</button>
    </div>
  </div>
</body>

关于javascript - 为什么我的 JavaScript 计算器一直输出 0?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47847006/

相关文章:

javascript - 我如何处理 ajax 和关闭页面

html - 将 <li> 拆分为两列

html - img 外部 div

javascript - 如果内容未保存,则防止导航到另一个 View

javascript - Parsley.js - 将标签值附加到错误消息

javascript - 使用 Express 和 Node.js 的谷歌地图 API

javascript - JQuery.ajax() 加载空白 XML 文件,没有错误。

html - float 和固定宽度 li 的组合

javascript - Jquery根据两个div之间的视口(viewport)将位置固定为静态

javascript - 如何确定我的 Angular 网页的速度?