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> <title>Price calculation after discount</title> <!-- Set the price calculation event function, take different drop-down discount amounts, and send the calculation results 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 transaction is successful!"); }else { prices.focus(); prices.select(); alert("Please enter the correct price and quantity (cannot be empty)!"); } } </script> </head> <!-- Define the interface format, set the drop-down table, set the calculation price event--> <body> <center> <form name="discount" action="result.jsp" method="post"> Bidding price: <input type="text" id="price" style="width: 150px"/> Purchase quantity: <input type="text" id="number" style="width: 150px"/> Payment method: <select id="payfunction" style="width: 150px"> <option value="1">Online banking payment - 50% discount</option> <option value="2">Alipay payment - 20% off</option> <option value="3" selected="true">Q coin payment - 40% off</option> </select> Estimated total price: <input type="text" id="result" style="width: 150px"> <input type="button" id="allresult" value="Calculate total price" onclick="calculator()" /> </form> </center> </body> </html> |
<<: Detailed explanation of the JavaScript timer principle
>>: How to set up vscode remote connection to server docker container
The most important interactive design article in ...
Standalone hbase, let’s talk about it first. Inst...
Recently, I have been working on a project and ne...
Copy code The code is as follows: <!DOCTYPE ht...
1. What is HTML HTML (HyperText Markup Language):...
Alignment issues like type="radio" and t...
Effect html <div class="sp-container"...
There is a task process on the server. When we us...
1. Object-oriented class inheritance In the above...
Table of contents 1. Installation: 2. Use: 3. Bui...
Docker Compose is a Docker tool for defining and ...
Use native JavaScript to simply implement the cou...
Startups often bring us surprises with their unco...
Table of contents Preface 1. The request content ...
This article example shares the specific code of ...