Basic Tip Calculator JavaScript

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Basic Tip Calculator JavaScript相关的知识,希望对你有一定的参考价值。

我非常基本的小费计算器无法正常工作。我觉得我的逻辑是正确的,语法应该没问题,但是我遗漏了一些东西,因此我已经花了太多时间。请帮忙。非常感谢。

<body>
<input type='number' placeholder='Total price' id='user-input'/>
<button id="calculator">Calculate the tip</button>
<h3 id='result'></h3>
<script>
  var userInput = document.getElementById('user-input');
  var button = document.getElementById('calculator');
  var h3El = document.getElementById('result');
  button.addEventListener('click', tipCalculator);
  function tipCalculator(){
    var tip = userInput * 0.1;
    h3El.innerhtml = tip;
  }
  tipCalculator();
</script>
答案

由于值为字符串,所以显示NaN

var userInput = document.getElementById('user-input').value;
userInput = parseInt(userInput) //convert it into Number
另一答案

更改此

var userInput = document.getElementById('user-input');

对此

var userInput = document.getElementById('user-input').value;

以上是关于Basic Tip Calculator JavaScript的主要内容,如果未能解决你的问题,请参考以下文章

leetcode 227. Basic Calculator II ---------- java

224. Basic Calculator

227. Basic Calculator II

LeetCode 772. Basic Calculator III

LeetCode227:Basic Calculator II

Basic Calculator - Stack(表达式计算器)