我很难在用户输入时向用户显示一些实时信息,我相信Java脚本在这种情况下会很有用,但是由于我是这种语言的外行,所以所有帮助都是值得的。
例如,用户在value
字段1300和discount
字段100中键入。
在percentage
中,我需要执行以下操作:价值-折扣* 1.5%
(1300-100 = 1200 * 1.5%= 18)
在liquid
中,我需要执行以下操作:值-折扣-百分比
(1300-100 = 1200-18 = 1182)
返回的值将只能读取两位小数。
我的代码:
<form method="post" action="process.php">
<label>Value</label>
<input type="text">
<label>Discount</label>
<input type="text">
<label>Percentage</label>
<input type="text">
<label>Liquid</label>
<input type="text">
<button type="submit">Submit</button>
</form>
结果将如下所示:
最佳答案
我做了一些小的修改,只允许数字,并将最后两个输入设置为只读。
var value = document.getElementById("value");
var discount = document.getElementById("discount");
var percentage = document.getElementById("percentage");
var liquid = document.getElementById("liquid");
function calc() {
if (!value.value || !discount.value) {
return;
}
percentage.value = ((value.value - discount.value) * 0.015).toFixed(2);
liquid.value = (value.value - discount.value - percentage.value).toFixed(2);
}
value.addEventListener("change", calc);
value.addEventListener("keyup", calc);
discount.addEventListener("change", calc);
discount.addEventListener("keyup", calc);
<form method="post" action="process.php">
<label>Value</label>
<input type="number" id="value" name="value">
<label>Discount</label>
<input type="number" id="discount" name="discount">
<label>Percentage</label>
<input type="number" id="percentage" name="percentage" readonly>
<label>Liquid</label>
<input type="number" id="liquid" name="liquid" readonly>
<button type="submit">Submit</button>
</form>
关于javascript - 显示实时值,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/46459742/