Question

我的应用程序的旧代码使用javascript来计算内容，逻辑是如果1个文本框填充，另一个文本框自动填充，当第二个文本框填充时，另一个文本框将返回text1 - text2，也许你可以看看在这个小提琴：

HTML：

<label>Price Start</label>
<input type="number" class="form-control" placeholder="Total Harga Diberikan" required="required" name="price" onkeyup="calculate()" id="price" />
<br />
<label>Discount</label>
<input type="number" class="form-control" placeholder="Nominal Potongan" name="jmlvoucher" onkeyup="calculate()" id="jmlvoucher" />
<br />
<label>Total</label>
<input type="number" class="form-control" placeholder="Total yang harus dibayarkan" required="required" name="total" id="total" />

使用Javascript：

function calculate(){
    var num1 = document.getElementById("price").value;
    var num2 = document.getElementById("jmlvoucher").value;

    var sum=parseFloat(num1)-parseFloat(num2);
    document.getElementById('total').value=sum.toString();
}

http://jsfiddle.net/n4anv5qn/2/

已经尝试检查错误，但没有错误。尝试运行它，它不起作用。知道为什么吗？

Answer 1

在启动密钥时确实会产生错误。

Uncaught ReferenceError: calculate is not defined

在JSFiddle上，您选择将JavaScript放入onLoad函数中，这是错误的。您应该选择No Wrap

请参阅http://jsfiddle.net/n4anv5qn/5/

根据要求，此代码是一个示例，说明如果未填写折扣，您仍然可以计算总计。只需检查您从num2中获取的值是否为空，并将其设置为默认值。

function calculate(){
    var num1 = document.getElementById("price").value;
    var num2 = document.getElementById("jmlvoucher").value;

    if (num2 == '')
        num2 = '0';

    var sum=parseFloat(num1)-parseFloat(num2);
    document.getElementById('total').value=sum.toString();
}

Answer 2

您应该使用onchange代替onkeyup。还要将您的脚本放在关闭正文标记之前。

以下是如何操作：

<label>Price Start</label>
		<input type="number" class="form-control"name="price" onchange="calculate()" id="price" />
    <br />
    <label>Discount</label>
	    <input type="number" class="form-control" onchange="calculate()" id="jmlvoucher" />
    <br />
    <label>Total</label>
		<input type="number" class="form-control" required="required" name="total" id="total" />

    <script>
    function calculate(){
		var num1 = document.getElementById("price").value;
		var num2 = document.getElementById("jmlvoucher").value;

		var sum = parseFloat(num1) - parseFloat(num2);
		document.getElementById('total').value = sum;
    }
    </script>

运行JavaScript函数onkeyup不起作用

2 个答案: