Question

很快就会有一个数学项目。

我试图应用DRY概念，但我不知道如何。我开始编写一个适用于所有数字的函数，但在其中途，我意识到它无法工作。匿名函数需要更改我知道，但我现在不能，因为我不知道另一种方法来实现它。

document.querySelector(".button").addEventListener("click", function) {
  num = document.getElementById('something'); 

  if (num != null && num === document.getElementById("zero")) {
    calculation = calculation.concat("0");
  } else if (num != null && num === document.getElementById("one")) {
    calculation = calculation.concat("1");
  } else if (num != null === && num document.getElementbyId("two")) {
    calculation = calculation.concat("2");
  } else if (num != nul && num === document.getElementbyId("three")) {
    calculation = calculation.concat("3");
  } else if (num != nul && num === document.getElementbyId("four")) {
    calculation = calculation.concat("4");
  } else if (num != nul && num === document.getElementbyId("five")) {
    calculation = calculation.concat("5");
  } else if (num != nul && num === document.getElementbyId()) {
    calculation = calculation.concat("6");
  }
}

每个数字都在一个表格内的按钮内。他们还有id识别他们的号码。我不是在寻找代码，也不想抄袭任何东西。只是寻找关于我可以做些什么的建议。

Answer 1

最简单的方法是编写一个通用函数：

var buttons = document.querySelectorAll("button");
for (var i = 0; i < buttons.length; i++) {
  buttons[i].addEventListener(
    "click",
    function() {
    var current_value = this.innerHTML; //typed single number
    var display_value = document.getElementById('display').value; //the value on the calculator display
    var new_value = display_value + '' + current_value; //+''+ to make it string
    document.getElementById('display').value = new_value;
  });
}

尝试此操作，并使用与上述相同的方法添加例外和计算函数，方法是过滤“+”，“ - ”等值。

Answer 2

我觉得如果你使用jquery就更容易..只是一个建议。

请看小提琴。

我在所有按钮上添加了一个类'show'，我们希望在屏幕上显示所有按钮，并为所有操作按钮设置类'calc'。用以下jquery替换你的显示javascript

var calculation='';
$('button.show').click(function(){
 calculation = calculation.concat($(this).text());
 $('#screen').text(calculation);
});

还添加了计算脚本

请参阅小提琴Updated Fiddle

不确定如何使此计算器功能正常工作

2 个答案: