使用输入和跨度字段的 Javascript 计算

Javascript calculation using input and span fields

本文关键字：字段 Javascript 计算 输入      更新时间：2023-09-26
<input type="number" name="quantity" id="quantity">
<span id="price">4000</span>
<input type="text" value="" id="total" readonly>
<input type="button" value="calculate Total Price" onClick="calculate()">

我需要来自字段 name="quantity" 的值和上面的id="price"并使用 javascript 函数进行计算，并且仅在单击计算按钮时才将其显示在字段id="total"中。我尝试了下面的javascript函数，但结果显示为NaN。

function calculate(tot) {
        var quan = document.getElementsByName('quantity').value;
        var pri = document.getElementById('price');
        var pr = parseInt(pri);
        var tot = quan * pr;
        document.getElementById("total").value = tot;
}

每当你看到一个复数的方法，比如getElementsByName它得到多个元素，或者我们所说的nodeList，即使只有一个匹配的元素，你仍然会得到一个nodeList，而nodeList没有值，你可以像数组一样访问nodeList并获取列表中的第一个元素，如下所示：

var quan = document.getElementsByName('quantity')[0].value;

此外，getElementById得到一个元素，而不是一个数字，你必须得到内部HTML

var pri = document.getElementById('price').innerHTML;

并记住基数parseInt 

parseInt(pri, 10)

并不是说你在乘法时真的需要解析它

小提琴

您需要

一个for循环并遍历每个单独的值并将其放入一个值中。喜欢这个：

for(i=0; i<quan.length; i++) {
 var total+= quan[i];
}
相关文章：