Question

我希望我的计算器在第一个值中插入数字，直到单击运算符（如+）为止。然后插入的数字应转到第二个值。

如果我单击+，则不会切换到第一个if语句。

let clicked = 0;

console.log('startValue: ' + clicked);

operatorPlus_div.addEventListener('click', () => {
  clicked = 1;
  operator_div.innerHTML += '+';
  console.log('clickedValue: ' + clicked);
})



function calc() {
  //----------second-Value----------
  if (clicked === 1) {
    valueOne_p.addEventListener('click', () => {
      secondValue += one;
      secondValue_div.innerHTML += one;
      console.log('secondValue');
    })
    valueTwo_p.addEventListener('click', () => {
      secondValue += two;
      secondValue_div.innerHTML += two;
    })
    //----------first-Value----------
  } else if (clicked === 0) {
    valueOne_p.addEventListener('click', () => {
      firstValue += one;
      firstValue_div.innerHTML += one;
      console.log(clicked + ' firstValue');
      console.log(operator_div.innerHTML);
    })
    valueTwo_p.addEventListener('click', () => {
      firstValue += two;
      firstValue_div.innerHTML += two;
      console.log(clicked + ' firstValue');
    })
  }
}

calc();

这是html：

<!DOCTYPE html>
<html>
<head>
    <title>myCalc</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="media/css/style.css">
    <link rel="shortcut icon" type="image/x-icon" href="media/images/fav-icon.png">
</head>
<body>
    <div class="wrapper">
        <div class="container-all">
        <div id="heading">
            <h1>myCalc</h1>
        </div>
        <div class="container-input-showcase">
            <div id="first-value"></div>
            <div id="operator"></div>
            <div id="second-value">

            </div>
            <div class="underline"></div>
        </div>
        <div class="container-result">
            <div id="result">

            </div>
        </div>
        <div class="container-input">
            <div class="input" id="value-zero">
                <p>0</p>
            </div>
            <div class="input" id="value-one">
                <p>1</p>
            </div>
            <div class="input" id="value-two">
                <p>2</p>
            </div>
            <div class="input" id="value-three">
                <p>3</p>
            </div>
            <div class="input" id="value-four">
                <p>4</p>
            </div>
            <div class="input" id="value-five">
                <p>5</p>
            </div>
            <div class="input" id="value-six">
                <p>6</p>
            </div>
            <div class="input" id="value-seven">
                <p>7</p>
            </div>
            <div class="input" id="value-eight">
                <p>8</p>
            </div>
            <div class="input" id="value-nine">
                <p>9</p>
            </div>
            <div class="input" id="operator-plus">
                <p>+</p>
            </div>
            <div class="input" id="operator-minus">
                <p>-</p>
            </div>
            <div class="input" id="operator-multiply">
                <p>*</p>
            </div>
            <div class="input" id="operator-divide">
                <p>/</p>
            </div>
            <div class="reset"> 
                <p>CE</p>
            </div>
            <div class="equals"> 
                <p>=</p>
                <div clearer></div>
            </div>
        </div>
    </div>
    </div>

    <script src="media/script/app.js"></script>
</body>
</html>

我现在将calc（）放在operatorPlus_div.addEventListener函数中，如果我单击+，则单击的下一个数字将在secondValue中跳转。但这也影响了firstValue。

JavaScript计算器，如果语句不起作用

0 个答案: