當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
购物车的功能——JS源码
生活随笔
收集整理的這篇文章主要介紹了
购物车的功能——JS源码
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
? ?此CSS的對應(yīng)的是“購物車的功能——界面源碼”的內(nèi)容和“購物車的功能——CSS源碼”的內(nèi)容,希望大家不要亂
$(function(){//點擊復(fù)選框全選或全不選效果$("#allCheckBox").click(function(){var checked=$(this).is(":checked");$(".cart_td_1").children().attr("checked",checked);});//判斷是否全選function ifAllChecked(){var checkedBoxs=$(".cart_td_1").children();var sum=checkedBoxs.size();var k=0;checkedBoxs.each(function(index,dom){if($(dom).is(":checked")) k++;});if(k==sum){$("#allCheckBox").attr("checked",true);}else{$("#allCheckBox").attr("checked",false);}}ifAllChecked();//頁面加載完后運行//單選判斷$(".cart_td_1").children().click(function(){ifAllChecked();});//計算總價與小計function productCount(){var $tr=$("#shopping").find("tr[id]");var summer=0;var integral=0;$tr.each(function(i,dom){var num=$(dom).children(".cart_td_6").find("input").val();//商品數(shù)量var price=num*$(dom).children(".cart_td_5").text();//商品小計$(dom).children(".cart_td_7").html(price);//顯示商品小計summer+=price;//總價integral+=$(dom).children(".cart_td_4").text()*num;//積分});$("#total").text(summer);$("#integral").text(integral);}productCount();//頁面加載完后運行//商品增加減少,flag為true時增加,flag為false時減少function changeNumber(dom,flag){var $input = $(dom).parent().find("input");var value = $input.val();if(flag){value++;}else{value--;if(value<=0){value=1;alert("寶貝數(shù)量必須大于0");}}$input.val(value);productCount();};//點擊增加$(".cart_td_6").find("img[alt='minus']").click(function(){changeNumber(this,false);});//點擊減少$(".cart_td_6").find("img[alt='add']").click(function(){changeNumber(this,true);});//點擊刪除$(".cart_td_8").find("a").click(function(){$(this).parent().parent().prev().remove();//刪除前一tr$(this).parent().parent().remove();//刪除當前trproductCount();});//點擊刪除所選$("#deleteAll").click(function(){$("#shopping").find("tr[id]").each(function(i,e){var $tr=$(e);var checked=$tr.children(".cart_td_1").children().is(":checked");if(checked){$tr.prev().remove();$tr.remove();}});productCount();}); });總結(jié)
以上是生活随笔為你收集整理的购物车的功能——JS源码的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 苹果手机黑屏怎么办
- 下一篇: gradle idea java ssm