HTML discount calculation price principle and script code

Time:2019-11-16

Copy code

The code is as follows:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″>
<head>
Price calculation after discount
<! — set the calculation price event function, select different drop-down discounts, and send the calculation result to the text box — >
<script type=”text/javascript”>
function calculator(){
var prices=document.getElementById(“price”);
var discounts=document.getElementById(“number”);
var pay;
var select=document.getElementById(“payfunction”);
if((prices.value>=0&&!isNaN(prices.value))&&(discounts.value>=0&&!isNaN(discounts.value))&&prices.value!=””&&discounts.value!=””)
{
pay=prices.value*discounts.value;
switch(parseInt(select.value)){
case 1:pay=pay*0.5; break;
case 2:pay=pay*0.8; break;
case 3:pay=pay*0.6; break;
}
document.getElementById(“result”).value=pay;
Alert (“Congratulations, the deal was a success! “”;
}else
{
prices.focus();
prices.select();
Alert (“please enter the correct price and quantity (also cannot be empty)! “”;
}
}
</script>
</head>
<! — define interface format, set drop-down list, set calculation price event — >
<body>
<center>
<form name=”discount” action=”result.jsp” method=”post”>
Auction price: < input type = “text” style = “width: 150px” / >

Purchase quantity: < input type = “text” style = “width: 150px” / >

Payment method: < select style = “width: 150px” >
< option value = “1” > online banking payment – 50% off < / option >
<option value= “2” > Alipay payment – 20 percent off </option>
< option value = “3” selected = “true” > pay in Q currency – 60% off < / option >
</select>

Estimated total price: < input type = “text” style = “width: 150px” >

< input type = “button” value = “calculate total price” onclick = “calculator()” / >
</form>
</center>
</body>
</html>