js製作的簡易購物車
阿新 • • 發佈:2018-12-31
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>簡易購物車</title> <script type="text/javascript"> function cal(){ var num= parseInt(document.myform.num.value); var price=parseFloat(document.myform.price.value); var cost=parseFloat(document.myform.cost.value); var amount=num*price+cost; document.myform.amount.value=amount; } </script> </head> <body> <form action="" name="myform" method="post"> <table width="533" height="133" border="1" bgcolor="antiquewhite" align="center"> <tr align="center"> <td colspan="5"><h2>簡易購物車<h2/></td> </tr> <tr align="center"> <td>商品名稱</td> <td >數量(件)</td> <td>單價(美元)</td> <td>運費(美元)</td> <td><input type="button"value=" 合計 "onClick="cal()"></td> </tr> <tr> <td>跑跑道具</td> <td><input type="text" name="num"size="10"></td> <td><input type="text" name="price"size="10"></td> <td><input type="text"name="cost"size="10"></td> <td><input type="text" name="amount"size="10">美元</td> </tr> </table> </form> </body> </html>