我有问题。在计算器中。我只需要一个点

时间:2019-03-26 06:41:01

标签: javascript html css

只需要一个点,这样计算器就可以正常工作。像我现在没有很多点。现在很乱。我会努力  其他代码中的东西,但是现在我被困在这里。

 function dec(d) {

      let display = document.getElementById('display');
      let displayArray = display.innerHTML.split("");
      displayArray += d.innerHTML;
      display.innerHTML = displayArray;
      if (!displayArray.includes(".")) {
          displayArray += ".";
          displayArray = display;
      }

我已经尝试了一些东西,但是现在我无处可去。

我需要一个普通的,只有一个点,现在由于数组我  有       “,”在每个“。”上我点击

我现在问题出在哪里      用数组,拆分数组或其他方法做某事,但不要      知道问题到底出在哪里。

2 个答案:

答案 0 :(得分:0)

问题在于使用字符串

填充数组
displayArray += d.innerHTML;
默认情况下,数组的

string转换/ toString将所有带有','的元素连接起来

如果需要其他分隔符,则必须定义它

let array = [1,2,3,4]
console.log(array+'')
console.log(array.join())
console.log(array.toString())
//Correct one
console.log(array.join(''))

因此您的代码必须是

displayArray = displayArray.join('') + d.innerHTML;

但是displayArray不再是 Array 而是 String

答案 1 :(得分:0)

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Calculator</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>


  <script src="script.js"></script>



    <table class="main" id="gradient">
      <tr class="row">
        <th class="column displayValue" id="display">0</th>
      </tr>
      <tr class="row">
        <th class="buttons bckbtn" onclick="clearAll()">C</th>
        <th class="buttons bckbtn" onclick="backbutton(this)">backspace</th>
      </tr>
      <tr class="row">
        <th class="buttons" onclick="numbers(this)">7</th>
        <th class="buttons" onclick="numbers(this)">8</th>
        <th class="buttons" onclick="numbers(this)">9</th>
        <th class="buttons">/</th>
      </tr>
      <tr class="row">
        <th class="buttons" onclick="numbers(this)">4</th>
        <th class="buttons" onclick="numbers(this)">5</th>
        <th class="buttons" onclick="numbers(this)">6</th>
        <th class="buttons">x</th>
      </tr>
      <tr class="row">
        <th class="buttons" onclick="numbers(this)">1</th>
        <th class="buttons" onclick="numbers(this)">2</th>
        <th class="buttons" onclick="numbers(this)">3</th>
        <th class="buttons" onclick="numbers(this)">-</th>
      </tr>
      <tr class="row">
        <th class="buttons" id="decimal" onclick="dec(this)">.</th>
        <th class="buttons" onclick="numbers(this)">0</th>
        <th class="buttons" onclick="numbers(this)">=</th>
        <th class="buttons" onclick="numbers(this)">+</th>
      </tr>
    </table>


  </body>
</html>



function numbers(el) {

  let display = document.getElementById('display');

  if (display.innerHTML === "0") {
   display.innerHTML = "";
   display.innerHTML += el.innerHTML;
  }
  else {
    display.innerHTML += el.innerHTML;
  }
}


function clearAll() {

  let display = document.getElementById('display');
  display.innerHTML = "0";

}


function backbutton(b) {

  let display = document.getElementById('display');
  let value = display.innerHTML;
  let newValue = value.substr(0, value.length - 1);
  display.innerHTML = newValue;
  if (display.innerHTML === "") {
    display.innerHTML = "0";
  }
  document.getElementById("decimal").setAttribute("onclick", "dec(this)");

}


function dec(d) {

  let display = document.getElementById('display');
  let displayArray = display.innerHTML.split("");
  displayArray.join("") += d.innerHTML;
  display.innerHTML = displayArray;
  if (!displayArray.includes(".")) {
      displayArray += ".";
      displayArray = display;
  }

}