本文最后更新于727 天前,其中的信息可能已经过时,如有错误请发送邮件到97376394@qq.com
[precode] <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>当当网购物车页面</title> <link type="text/css" rel="stylesheet" href="css/cartStyle.css" /> </head> <body> <div> <div> <img src="images/dd_logo.jpg"><span onclick="close_plan();">关闭</span> </div> <div id="cartList"> <ul> <li>商品图片</li> <li>商品信息</li> <li>单价</li> <li>数量</li> <li>总价</li> <li>操作</li> </ul> <ul> <li><img src="images/dog.jpg"></li> <li>我和狗狗活下来了</li> <li>¥<input type="text" name="price" value="21.90"></li> <li><input type="button" name="minus" value="-" onclick="minus(0);"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+" onclick="plus(0);"></li> <li id="price0">¥21.90</li> <li><p onclick="collection();">移入收藏</p><p onclick="del(0);">删除</p></li> </ul> <ul> <li><img src="images/mai.jpg"></li> <li>灰霾来了怎么办</li> <li>¥<input type="text" name="price" value="24.00"></li> <li><input type="button" name="minus" value="-" onclick="minus(1);"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+" onclick="plus(1);"></li> <li id="price1">¥24.00</li> <li><p onclick="collection();">移入收藏</p><p onclick="del(1);">删除</p></li> </ul> <ol> <li id="totalPrice">商品总计:<span></span></li> <li><span onclick="accounts();">结 算</span></li> </ol> </div> <div style="display:none;"></div> </div> <script type="text/javascript" src="js/shopping.js"></script> </body>
//减
function minus(num){ var prices=document.getElementsByName("price")[num].value; var count=parseInt(document.getElementsByName("amount")[num].value)-1; if(count<1){ alert("不能再减了,再减就没有啦!"); } else{ document.getElementsByName("amount")[num].value=count; var totals=parseFloat(prices*count); document.getElementById("price"+num).innerHTML="¥" +totals.toFixed(2);//.toFixed(2)表示四舍五入,取2位小数点 total(); } } //增 function plus(num){ var prices=document.getElementsByName("price")[num].value; var count=parseInt(document.getElementsByName("amount")[num].value)+1; document.getElementsByName("amount")[num].value=count; var totals=parseFloat(prices*count); document.getElementById("price"+num).innerHTML="¥" +totals.toFixed(2); total(); } //计算总额 function total(){ var prices=document.getElementsByName("price"); var count=document.getElementsByName("amount"); var sum=0; for(var i=0; i<prices.length;i++){ sum+=prices[i].value*count[i].value; } document.getElementById("totalPrice").getElementsByTagName("span")[0].innerHTML="¥" +sum.toFixed(2); } //结算 function accounts(){ var obj=document.getElementById("cartList").nextElementSibling;//.nextElementSibling表示下一个同辈元素 obj.style.display="block"; var str="您本次购买的商品信息好下:"; str+="<br/>白岩松:白说:"+ document.getElementById("price0").innerHTML; str+="<br/>岛上书店:"+ document.getElementById("price1").innerHTML; str+="<br/>商品总计:"+document.getElementById("totalPrice").innerHTML; obj.innerHTML=str; } //删除 function del(num){ var ocartList=document.getElementById("cartList"); var delObj=document.getElementsByName("price")[num].parentNode.parentNode; ocartList.removeChild(delObj); total(); }
[/precode]