zoukankan      html  css  js  c++  java
  • HTML打折计算价格

     1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     2 <html>
     3 
     4      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     5 
     6   <head>
     7   
     8     <title>打折后价格计算</title>
     9   
    10   <!--  设置计算价格事件函数,取不同下拉打折数,计算结果送入文字框-->
    11   
    12       <script type="text/javascript">
    13 
    14     function calculator(){
    15         var prices=document.getElementById("price");
    16         var discounts=document.getElementById("number");
    17         var pay;
    18         var select=document.getElementById("payfunction");
    19         if((prices.value>=0&&!isNaN(prices.value))&&(discounts.value>=0&&!isNaN(discounts.value))&&prices.value!=""&&discounts.value!="")
    20         {
    21             pay=prices.value*discounts.value;
    22             
    23             switch(parseInt(select.value)){
    24             case 1:pay=pay*0.5; break;
    25             case 2:pay=pay*0.8; break;
    26             case 3:pay=pay*0.6;    break;
    27             }
    28             
    29             document.getElementById("result").value=pay;
    30             alert("恭喜你,交易成功!");
    31             
    32         }else
    33         {
    34             prices.focus();
    35             prices.select();
    36             alert("请输入正确的价格和数量(也不能为空)!");
    37         }
    38                                                           
    39     }
    40 
    41 
    42     </script>
    43 
    44   
    45   </head>
    46   
    47   <!--  定义界面格式,设置下拉表,设置计算价格事件-->
    48   
    49 <body>   
    50     <center>
    51     <form name="discount" action="result.jsp" method="post">
    52          竞拍价格:<input type="text" id="price" style=" 150px"/><br>
    53          
    54          购买数量:<input type="text" id="number" style=" 150px"/><br>
    55          
    56          支付方式:<select id="payfunction" style=" 150px">
    57          <option value="1">网银支付-打5折</option>
    58         <option value="2">支付宝支付-打8折</option>
    59         <option value="3" selected="true">Q币支付-打6折</option>    
    60          </select><br>
    61          
    62          预计总价:<input type="text" id="result" style=" 150px"><br>
    63          
    64          <input type="button" id="allresult"  value="计算总价" onclick="calculator()" /> 
    65     </form>
    66      </center>
    67    
    68   </body>
    69 </html>
  • 相关阅读:
    对线程的理解
    C#-设计模式-策略模式
    C#-设计模式-观察者模式
    C#-设计模式-模板方法
    C#-设计模式-适配器模式
    C#-设计模式-代理模式
    C#-设计模式-装饰模式
    C#-设计模式-简单工厂
    C#-设计模式-单例模式
    DotNet Core2.1 编写自己的中间件和后台服务
  • 原文地址:https://www.cnblogs.com/lifescolor/p/3874116.html
Copyright © 2011-2022 走看看