Question

晚上好，我正在尝试创建一个简单的应用程序来计算保险费率。第一个输入是项目的值（整数），第二个是保险费率，它将是十进制数字，一旦输入数字，它将做一些额外的数学计算以获得费用，然后发布总数网页上的文档。我似乎无法将总数显示在输入字段上。任何帮助将不胜感激，因为这是我的第一个项目。

谢谢你，埃德温

＆＃13;

total.addEventListener('click',() => {
    const rte1 = parseFloat(document.getElementById('val$').value);
    const rte2 = parseFloat(document.getElementById('valRate').value); 
    const surCharge = rte1 * rte2; 
    const ept = surCharge * .036;
    const totalCharge = surCharge + ept;
        
    document.getElementById('price').innerHTML = totalCharge;
});

＆＃13;

<p class="coll mt-4 text-primary">Enter Value:</p>
	<input id="val$" type="text" name="rate1">
	
    <p class="coll mt-4 text-primary">Enter Insurance Rate:</p>
	<input id="valRate" type="text" name="rate2">
	
	<!-- Calculate Button -->
	<button onclick="total" type="button" class="btn btn-primary active d-block mx-auto mt-4">Calculate</button>
	
	<p class="coll mt-5 text-primary">Total charges including IPT:</p>
	<input id="price" type="text">

＆＃13;

Answer 1

只需在HTML元素中使用onClick来调用Javascript函数：

＆＃13;

function total() {
    const rte1 = parseFloat(document.getElementById('val$').value);
    const rte2 = parseFloat(document.getElementById('valRate').value); 
    const surCharge = rte1 * rte2; 
    const ept = surCharge * .036;
    const totalCharge = surCharge + ept;

    document.getElementById('price').value = totalCharge;
};

＆＃13;

<p class="coll mt-4 text-primary">Enter Value:</p>
	<input id="val$" type="text" name="rate1">
	
    <p class="coll mt-4 text-primary">Enter Insurance Rate:</p>
	<input id="valRate" type="text" name="rate2">
	
	<!-- Calculate Button -->
	<button onclick="total()" type="button" class="btn btn-primary active d-block mx-auto mt-4">Calculate</button>
	
	<p class="coll mt-5 text-primary">Total charges including IPT:</p>
	<input id="price" type="text">

＆＃13;

您还需要使用.value代替.innerHTML来设置输入中的文字。

Answer 2

document.getElementById('price').innerHTML = totalCharge;

应该是

document.getElementById('price').value = totalCharge;

使用单击功能添加数字

2 个答案: