购物车功能

购物车效果图:

购物车功能 - 图1

如果没有数据如右图显示。

1、点击编辑,头部右侧文字变为完成,底部按钮变成删除:

  1. function edit(){
  2. var action = $('#changeEdit').html();
  3. if (action == '编辑') {
  4. $('#changeEdit').html('完成');
  5. uexWindow.evaluatePopoverScript("cart", "content", "removeUhide()");
  6. } else if (action == '完成') {
  7. $('#changeEdit').html('编辑');
  8. uexWindow.evaluatePopoverScript("cart", "content", "addUhide()");
  9. }
  10. }

2、点击全选,选中所有项,代码如下:

  1. function selectAll(){
  2. IdArr.length=0;
  3. $("#selectAll").toggleClass('fa fa-check shopStyleAll');
  4. if( $("#selectAll").hasClass('fa fa-check shopStyleAll')){
  5. $('.shop').addClass('fa fa-check shopStyle');
  6. $(".edit").toggleClass("flag");
  7. var sum=0;
  8. $('.shopStyle').each(function(i,item){
  9. var divId=$(this).attr("id");
  10. var number=$("#number"+divId).val();
  11. var price=$("#price"+divId).html();
  12. sum+=Number(number*price);
  13. })
  14. $("#localPrice").html(sum);
  15. }
  16. else{
  17. var sum=0;
  18. $('.shopStyle').each(function(i,item){
  19. var divId=$(this).attr("id");
  20. var number=$("#number"+divId).val();
  21. var price=$("#price"+divId).html();
  22. sum+=Number(number*price);
  23. $("#localPrice").html(sum);
  24. })
  25. $('.shop').removeClass('fa fa-check shopStyle');
  26. $(".edit").removeClass("flag");
  27. }
  28. $("#order").css("background-color","#00C1F9");
  29. flag=true;
  30. }