淘宝竞价案例:
JavaScript代码:
<script type="text/javascript"> function Pay(){ var Price=2000; var AddPrice = document.getElementById("AddPrice").value; if(AddPrice=="") { document.getElementById("span2").innerHTML='<font color="red">亲,请输入加的价格哦</font>'; } var num = document.getElementById("num").value; if(num=="") { document.getElementById("span3").innerHTML='<font color="red">亲,请输入您要拍的数量哦</font>'; } var sex = sex1.checked ? '男' : '女'; var totalMoney; var Pay1 = document.getElementById("Pay1"); var index = Pay1.selectedIndex; switch(index) { case 0: document.getElementById("span1").innerHTML='<font color="red">微信支付打九折</font>'; totalMoney = (parseInt(Price) + parseInt(AddPrice)) * parseInt(num)*0.9; break; case 1: document.getElementById("span1").innerHTML='<font color="red">支付宝支付打八折</font>'; totalMoney = (parseInt(Price) + parseInt(AddPrice)) * parseInt(num)*0.8; break; case 2: document.getElementById("span1").innerHTML='<font color="red">银联支付打七折</font>'; totalMoney = (parseInt(Price) + parseInt(AddPrice)) * parseInt(num)*0.7; break; case 3: document.getElementById("span1").innerHTML='<font color="red">QQ支付打九折</font>'; totalMoney = (parseInt(Price) + parseInt(AddPrice)) * parseInt(num)*0.9; break; case 4: document.getElementById("span1").innerHTML='<font color="red">刷卡支付不打折</font>'; totalMoney = (parseInt(Price) + parseInt(AddPrice)) * parseInt(num); break; default:document.getElementById("span1").innerHTML='<font color="red" >亲,支付方式可以进行选择的呦</font>'; } if(totalMoney==undefined) { document.getElementById("span5").innerHTML='<font color=red>总价无法计算呦</font>'; }else { document.getElementById("TotalPrice").value=totalMoney; } } </script>
HTML部分代码:
<body> <form action="#" method="post"> <h2>欢迎进入淘宝竞拍</h2> <h3>本次拍卖品为:导盲犬</h3> 底价: <input type="text" id="Price" value="2000" /><br/><br/> 加价: <input type="text" id="AddPrice" /><br/> <span id="span2"></span><br/> 数量: <input type="text" id="num" /><br/> <span id="span3"></span><br/> 性别: <input type="radio" id="sex1" name="sex" checked="checked"/>男 <input type="radio" id="sex2" name="sex" />女<br/><br/> 付款方式: <select id="Pay1"> <option>微信支付</option> <option>支付宝支付</option> <option>银联支付</option> <option>QQ支付</option> <option>刷卡支付</option> </select><br/> <span id="span1" ></span><br/> 总价: <input type="text" id="TotalPrice" /><br/><span id="span5" ></span><br/> <input type="button" value="确认" name="dj" onclick="Pay()" /> </form> </body>
结果运行图: