javascript - ParseFloat 变为 NaN

Question

大家好，我有这个代码

function computeChange(){
var change;
var amountDue = parseFloat(document.getElementById("amountDue").value);
var amountReceive = parseFloat(document.getElementById("amountReceive").value);
change = amountReceive - amountDue;
document.getElementById('amountChange').innerHTML = change;
}



<td>Total Amount</td>
<td>Php:<span id="amountDue"><?php echo $sum; ?></span></td>
</tr>
<tr>
<td>Amount Paid</td>
<td><input type="number" id="amountReceive" required="required" maxlength="4" size="4" onKeyUp="computeChange()"></td>
</tr>
<tr>
<td>Change</td>
<td>Php:<span id="amountChange"></span></td>
</tr>

总金额是
支付金额的小数输入类型=文本

所以问题是如果我在文本框中输入一些东西，变化的跨度就会发生NaN

Answer 1

parseFloat( document.getElementById("amountDue").value );

技术上等同于

parseFloat( undefined );

这会产生该值NaN，因为 span 元素没有名为 的属性.value。也许你想要.innerHTML？

parseFloat( document.getElementById("amountDue").innerHTML );

Answer 2

#amountDue是一个<span>元素，所以它没有value属性。

用于.innerHTML获取其内容。

var amountDue = parseFloat(document.getElementById("amountDue").innerHTML);

Answer 3

这不会返回值：

      document.getElementById("amountDue").value

asamountDue不是 HTML 输入元素。

试试下面：

     document.getElementById("amountDue").innerHTML;

IE

    var amountDue = parseFloat(document.getElementById("amountDue").innerHTML);

Answer 4

value的 amountDue 正在返回undefined，导致 parseFloat 改为返回NaN Use innerHTML。更改此行

var amountDue = parseFloat(document.getElementById("amountDue").value);

至

var amountDue = parseFloat(document.getElementById("amountDue").innerHTML);