时间戳

首页 > 解决方案 > 如何在按键上多个两个输入并添加第三个输入

javascript - 如何在按键上多个两个输入并添加第三个输入

问题描述

如何在按键上将两个输入相乘并添加第三个输入我有一个三个输入字段需要多个前两个输入并添加第三个输入然后显示结果字段 HTML 代码：

<input type="text" tabindex="3" class="form-control" name="making_charge" oninput="calculate()" placeholder="Making Charge" id="box3" required />

 <input type="text" tabindex="3" class="form-control" name="total_price" placeholder="Total Price" id="result" readonly  />

function calculate() {
        var myBox1 = document.getElementById('box1').value; 
        var myBox2 = document.getElementById('box2').value;
        var myBox3 = document.getElementById('box3').value;
        var result = document.getElementById('result'); 
        var myResult = myBox1 * myBox2 + myBox3;
        result.value = myResult; 
    }

标签： javascript

解决方案

Wellvalue是一个字符串，因此您需要将其转换为一个数字才能对其进行数学运算。

你可以用+, Number(), parseInt(),parseFloat()

function calculate() {
  var myBox1 = +document.getElementById('box1').value;
  var myBox2 = +document.getElementById('box2').value;
  var myBox3 = +document.getElementById('box3').value;
  var result = document.getElementById('result');
  var myResult = myBox1 * myBox2 + myBox3;
  result.value = myResult;
}
<input type="text" tabindex="3" class="form-control" name="making_charge" oninput="calculate()" placeholder="Making Charge" id="box1" required />

<input type="text" tabindex="3" class="form-control" name="making_charge" oninput="calculate()" placeholder="Making Charge" id="box2" required />

<input type="text" tabindex="3" class="form-control" name="making_charge" oninput="calculate()" placeholder="Making Charge" id="box3" required />

<input name="total_price" placeholder="Total Price" id="result" readonly />

推荐阅读