下拉列表中的javascript折扣计算

Question

我尝试将gross total值从discount计算到sub total值。

以下是我的代码：

HTML / PHP

<select class="select" id="discount" onchange="discountedGrossTotal()">
 <option selected>0</option>
 <option value=".02">2</option>
 <option value=".03">3</option>
 <option value=".04">4</option>
</select> </td>

<input name="txtGrossTotal" type="text" id="txtGrossTotal" size="15" readonly/>

<input name="txtSubTotal" type="text" id="txtSubTotal" size="15" value="<?php $sql=mysqli_query($connection,'select sum(amount) from sales_temp');
$row = mysqli_fetch_array($sql);
echo $row[0]; ?>"/>

的Javascript

function discountedGrossTotal(){
var discountOption = document.getElementById("discount"),
subTotal = document.getElementById("txtSubTotal"),
grossTotal = document.getElementById("txtGrossTotal");

discountOption.addEventListener('change', function (e) {
grossTotal.value = subTotal - subTotal * this[this.selectedIndex].value;
});
}

当选择下拉列表的第一个选项时，它在Gross Total文本框中不显示任何内容。从那时起，它显示为＆＃34; NaN＆＃34;在文本框中，无论选择什么选项。

感谢你的帮助。

Answer 1

function discountedGrossTotal(dropdownVal){
 var discountOption = document.getElementById("discount"),
 subTotal = document.getElementById("txtSubTotal"),
 grossTotal = document.getElementById("txtGrossTotal");
 grossTotal.value = subTotal.value - (subTotal.value * dropdownVal);

}

<select class="select" id="discount" onchange="discountedGrossTotal(this.value)">
 <option value="0">0</option>
 <option value=".02">2</option>
 <option value=".03">3</option>
 <option value=".04">4</option>
</select> 

<input name="txtGrossTotal" type="text" id="txtGrossTotal" size="15" value="" readonly/>

<input name="txtSubTotal" type="text" id="txtSubTotal" size="15" value="200"/>

Answer 2

我建议使用其中任何一种方法：

<强> HTML / PHP

<select class="select" id="discount">
 <option selected>0</option>
 <option value=".02">2</option>
 <option value=".03">3</option>
 <option value=".04">4</option>
</select> </td>

<input name="txtGrossTotal" type="text" id="txtGrossTotal" size="15" readonly/>

<input name="txtSubTotal" type="text" id="txtSubTotal" size="15" value="<?php $sql=mysqli_query($connection,'select sum(amount) from sales_temp');
$row = mysqli_fetch_array($sql);
echo $row[0]; ?>"/>

<强>的Javascript

var discountOption = document.getElementById("discount");

discountOption.addEventListener('change', function (e) {

var dropdownVal = document.getElementById("discount").value;;
var subTotal = document.getElementById("txtSubTotal").value;
var grossTotal = document.getElementById("txtGrossTotal").value;

grossTotal.value = (subTotal) - (subTotal * dropdownVal);

});
}