Javascript百分比计算器加法器功能不起作用

标签 javascript function percentage

<分区>

我正在构建一个百分比计算器来学习 JavaScript。以下是我的尝试。

其中一个函数工作得很好(从数字中减去百分比的函数),但是将百分比添加到数字的函数似乎是在添加值,就像它们是一个字符串一样。我已经寻找解决方案并且使用 parseInt() 似乎出现了很多但我似乎无法用我目前的代码实现它所以我希望有人可以提供帮助。

function myFunction() {
  var per = document.getElementById("input1").value;
  var num = document.getElementById("input2").value;
  var sum = num / 100 * per;
  var output = num - sum;

  console.log(output);

  document.getElementById("demo").innerHTML = output;

}


function myFunction2() {
  var per = document.getElementById("input3").value;
  var num = document.getElementById("input4").value;
  var sum = num / 100 * per;
  var output = sum + num;

  console.log(output);

  document.getElementById("demo1").innerHTML = output;

}
<section id="number less percentage"></section>

<h1>Number less percentage</h1>

<input id="input2" placeholder="enter the number"></input>

<input id="input1" placeholder="enter percentage of a number"></input>

<button value='send' id="submit" onclick="myFunction()">Click for 
    result</button>

<p id="demo"></p>

</section>

<section id="number plus percentage"></section>

<h1>Number plus percentage</h1>

<input id="input4" placeholder="enter the number"></input>

<input id="input3" placeholder="enter percentage of a number"></input>

<button value='send' id="submit" onclick="myFunction2()">Click for 
    result</button>

<p id="demo1"></p>

</section>

最佳答案

JavaScript 在处理数字和加法时有点搞笑。例如:

'20' - '30' === 10      // `-` always coerces operands to numbers
'20' + '30' === '2030'  // `+` with strings is interpreted as concatenation

document.getElementById 返回的值是字符串,因此最好在进行加法或减法之前将它们全部(即使是有效的)解析为数字.您的代码可以是:

function calculate() {
  var per = parseInt(document.getElementById('input1').value);
  var num = parseInt(document.getElementById('input2').value);

  var sum = (num / 100) * per;
  var output = num - sum;

  console.log(output);

  document.getElementById('demo').innerHTML = output;
}

function myFunction2() {
  var per = parseInt(document.getElementById('input3').value);
  var num = parseInt(document.getElementById('input4').value);

  var sum = (num / 100) * per;
  var output = sum + num;

  console.log(output);

  document.getElementById('demo1').innerHTML = output;
}

关于Javascript百分比计算器加法器功能不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54676905/

相关文章:

c - 初学者 C 编程将指针传递给函数会产生无法预料的结果

distance - 使用 Levenshtein 距离匹配的匹配百分比排名

javascript - Vis.js 中垂直滚动的解决方法

javascript - 关于javascript/jquery缓存的问题

javascript - Javascript 对象中的变量由此设置

matlab - 是否可以使用 parfor 循环更改两个函数?

html - 从包装器内的 60% 宽度中排除 div

mysql - 如何在mysql中比较两个表的计数和百分比

javascript - 根据链接的文本更改文本

javascript - Prop 类型 : The prop `onPress` is marked as required in `Button` , 失败,但其值为 `undefined`