html表单输入javascript和字段
html表单输入javascript和字段
提问于 2015-06-16 22:32:16
我有一个表格，你可以选择是否客户交税，如果我们给予折扣，违约价格，价格后折扣，价格税后和总价格。
以下是我所拥有的：
<table width="339" border="0" cellpadding="0">
<tr>
<td width="98">Taxes</td>
<td width="115">Discount</td>
<td width="118">Default price</td>
</tr>
<tr>
<td>
<select class="select" name="taxes">
<option value="no" selected>no taxes</option>
<option value="yes">19% taxes</option>
</select>
</td>
<td>
<select class="select" name="discount" onChange="updateInput()">
<option value="5" selected>5% discount</option>
<option value="10">10% discount</option>
<option value="20">20% discount</option>
</select>
</td>
<td>
<input type="text" class="input140" name="cost" id="cost" value="1000">
</td>
</tr>
<tr>
<td>Price after discount</td>
<td>Taxes</td>
<td>Total Price to pay</td>
</tr>
<tr>
<td>
<input type="text" name="price" value="">
</td>
<td>
<input type="text" name="taxes" value="0">
</td>
<td>
<input type="text" name="total" value="0">
</td>
</tr>
</table>
<script>
function updateInput() {
var discount = document.getElementsByName("discount")[0].value;
var cost = document.getElementsByName("cost")[0].value;
document.getElementsByName("price")[0].value = cost - (cost * (discount / 100));
}
</script>我试图使此表单工作，但如果我重复使用的javascript，它将不起作用。
这是演示Fiddle
https://jsfiddle.net/nte6xqdv/6/
我们的默认价格是1.000工作罚款，如果我们加上折扣给客户，它改变罚款后的价格折扣。
但是，如果我选择对19%的税收是肯定的，它不会改变任何东西，而且折扣加税后的总价格也不起作用。有什么想法吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-06-16 22:45:49
您的代码几乎没问题，只是需要一些小的修复:您使用的选择“赋税”和输入“赋税”(现在是"ttaxes")的名称相同，您将值“是”分配给了该税(我将其修改为19)，最后，复制粘贴自己的代码来计算折扣(用于计算税收)。现在你只有一件事要做:计算两者的总和(总价)。在这里，这些更改由注释箭头指向：
<html>
<body>
<table width="339" border="0" cellpadding="0">
<tr>
<td width="98">Taxes</td>
<td width="115">Discount</td>
<td width="118">Default price</td>
</tr>
<tr>
<td><select class="select" name="taxes" onChange="updateInput()">
<option value="no" selected>no taxes</option>
<option value="19">19% taxes</option> <!-- <====================== -->
</select></td>
<td><select class="select" name="discount" onChange="updateInput()">
<option value="5" selected>5% discount</option>
<option value="10">10% discount</option>
<option value="20">20% discount</option>
</select></td>
<td><input type="text" class="input140" name="cost" id="cost" value="1000"></td>
</tr>
<tr>
<td>Price after discount</td>
<td>Taxes</td>
<td>Total Price to pay</td>
</tr>
<tr>
<td><input type="text" name="price" value=""></td>
<td><input type="text" name="ttaxes" value="0"></td> <!-- <====================== -->
<td><input type="text" name="total" value="0"></td>
</tr>
</table>
<script type="text/javascript">
function updateInput(){
var discount = document.getElementsByName("discount")[0].value;
var cost = document.getElementsByName("cost")[0].value;
document.getElementsByName("price")[0].value = cost - (cost * (discount / 100));
var taxes = document.getElementsByName("taxes")[0].value; // <======================
if ( isNaN( taxes ) ) // IF "no taxes" IS SELECTED...
document.getElementsByName("ttaxes")[0].value = 0;
else { cost = document.getElementsByName("cost")[0].value;
document.getElementsByName("ttaxes")[0].value = (cost * (taxes / 100));
}
document.getElementsByName("total")[0].value =
parseFloat( document.getElementsByName("price")[0].value ) +
parseFloat( document.getElementsByName("ttaxes")[0].value );
}
</script>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30879386
复制相关文章
相似问题
腾讯云开发者
