关闭

jq删除当前行以及前一行,淘宝购物车

标签: jq删除行
1155人阅读 评论(0) 收藏 举报
<table width="100%" border="0" cellspacing="0" cellpadding="0" id="shopping">        
            <tr>
                <td class="title_1"><input id="allCheckBox" type="checkbox" value="" />全选</td>
                <td class="title_2" colspan="2">店铺宝贝</td>
                <td class="title_3">获积分</td>
                <td class="title_4">单价(元)</td>
                <td class="title_5">数量</td>
                <td class="title_6">小计(元)</td>
                <td class="title_7">操作</td>
            </tr>
            <tr>
                <td colspan="8" class="line"></td>
            </tr>
            <tr>
                <td colspan="8" class="shopInfo">店铺:<a href="#">纤巧百媚时尚鞋坊</a>    卖家:<a href="#">纤巧百媚</a> <img src="images/taobao_relation.jpg" alt="relation" /></td>
            </tr>
            <tr id="product1">
                <td class="cart_td_1"><input name="cartCheckBox" type="checkbox" value="product1" /></td>
                <td class="cart_td_2"><img src="images/taobao_cart_01.jpg" alt="shopping"/></td>
                <td class="cart_td_3"><a href="#">日韩流行风时尚美眉最爱独特米字拼图金属坡跟公主靴子黑色</a><br />
                    颜色:棕色 尺码:37<br />
                    保障:<img src="images/taobao_icon_01.jpg" alt="icon" /></td>
                <td class="cart_td_4">5</td>
                <td class="cart_td_5">138.00</td>
                <td class="cart_td_6"><img src="images/taobao_minus.jpg" alt="minus" class="down"/> <input id="num_1" type="text"  value="1" class="num_input" readonly="readonly"/> <img src="images/taobao_adding.jpg" alt="add" class="hand"/></td>
                <td class="cart_td_7"></td>
                <td class="cart_td_8"><a href="javascript:void(0);">删除</a></td>
            </tr>

            <tr>
                <td colspan="8" class="shopInfo">店铺:<a href="#">香港我的美丽日记</a>    卖家:<a href="#">lokemick2009</a> <img src="images/taobao_relation.jpg" alt="relation" /></td>
            </tr>
            <tr id="product2">
                <td class="cart_td_1"><input name="cartCheckBox" type="checkbox" value="product2" /></td>
                <td class="cart_td_2"><img src="images/taobao_cart_02.jpg" alt="shopping"/></td>
                <td class="cart_td_3"><a href="#">chanel/香奈尔/香奈尔炫亮魅力唇膏3.5g</a><br />
                    保障:<img src="images/taobao_icon_01.jpg" alt="icon" /> <img src="images/taobao_icon_02.jpg" alt="icon" /></td>
                <td class="cart_td_4">12</td>
                <td class="cart_td_5">265.00</td>
                <td class="cart_td_6"><img src="images/taobao_minus.jpg" alt="minus" class="down"/> <input id="num_2" type="text"  value="1" class="num_input" readonly="readonly"/> <img src="images/taobao_adding.jpg" alt="add" class="hand"/></td>
                <td class="cart_td_7"></td>
                <td class="cart_td_8"><a href="javascript:void(0);">删除</a></td>
            </tr>

            <tr>
                <td colspan="8" class="shopInfo">店铺:<a href="#">实体经营</a>    卖家:<a href="#">林颜店铺</a> <img src="images/taobao_relation.jpg" alt="relation" /></td>
            </tr>
            <tr id="product3">
                <td class="cart_td_1"><input name="cartCheckBox" type="checkbox" value="product3"/></td>
                <td class="cart_td_2"><img src="images/taobao_cart_03.jpg" alt="shopping"/></td>
                <td class="cart_td_3"><a href="#">蝶妆海?蓝清滢粉底液10#(象牙白)</a><br />
                    保障:<img src="images/taobao_icon_01.jpg" alt="icon" /> <img src="images/taobao_icon_02.jpg" alt="icon" /></td>
                <td class="cart_td_4">3</td>
                <td class="cart_td_5">85.00</td>
                <td class="cart_td_6"><img src="images/taobao_minus.jpg" alt="minus" class="down"/> <input id="num_3" type="text"  value="1" class="num_input" readonly="readonly"/> <img src="images/taobao_adding.jpg" alt="add" class="hand"/></td>
                <td class="cart_td_7"></td>
                <td class="cart_td_8"><a href="javascript:void(0);">删除</a></td>
            </tr>

            <tr>
                <td colspan="8" class="shopInfo">店铺:<a href="#">红豆豆的小屋</a>    卖家:<a href="#">taobao豆豆</a> <img src="images/taobao_relation.jpg" alt="relation" /></td>
            </tr>
            <tr id="product4">
                <td class="cart_td_1"><input name="cartCheckBox" type="checkbox" value="product4"/></td>
                <td class="cart_td_2"><img src="images/taobao_cart_04.jpg" alt="shopping"/></td>
                <td class="cart_td_3"><a href="#">相宜促销专供 大S推荐 最好用的LilyBell化妆棉</a><br />
                    保障:<img src="images/taobao_icon_01.jpg" alt="icon" /></td>
                <td class="cart_td_4">12</td>
                <td class="cart_td_5">12.00</td>
                <td class="cart_td_6"><img src="images/taobao_minus.jpg" alt="minus" class="down"/> <input id="num_4" type="text"  value="2" class="num_input" readonly="readonly"/> <img src="images/taobao_adding.jpg" alt="add" class="hand"/></td>
                <td class="cart_td_7"></td>
                <td class="cart_td_8"><a href="javascript:void(0);">删除</a></td>
            </tr>

            <tr>
                <td  colspan="3"><a id="deleteAll" href="javascript:void(0);"><img src="images/taobao_del.jpg" alt="delete"/></a></td>
                <td colspan="5" class="shopend">商品总价(不含运费):<label id="total" class="yellow"></label> 元<br />
                    可获积分 <label class="yellow" id="integral"></label> 点<br />
                    <input name=" " type="image" src="images/taobao_subtn.jpg" /></td>
            </tr>        
    	</table>
               
$(".cart_td_8").click(function(){
		//删除前一行表格
		$(this).parent().prev().remove();
		//删除当前行表格
		$(this).parent().remove();
                //重新计算价格
		total()
		
	})


0
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

淘宝购物车前端(JS和Angularjs版本)

今天用HTML和JS实现以下购物车,然后再用Angualrjs加bootstrap再去实现一下购物车的前端实现。功能页面分析:既然是做模仿淘宝购物车,肯定要先去分析一下淘宝的购物车页面,自己去淘宝卖了...
  • liaodehong
  • liaodehong
  • 2016-09-15 18:21
  • 5228

Jquery仿淘宝购物车

首先看效果图,点击全选按钮,所有带条目的复选框按钮都会随之变化,观察结算按钮的颜色变化。带条目的复选框按钮没有被全部选中时,全选按钮也不会被选中。 $(function() { showTo...
  • u010001192
  • u010001192
  • 2015-05-02 16:15
  • 1602

Android实现淘宝购物车

先上效果: 购物车实现使用的ExpandableListView,关于它的使用的就不在多说,网上的资料都非常多。 xml里面布局代码: <LinearLayout xmlns:android="h...
  • SilenceOO
  • SilenceOO
  • 2017-07-05 17:04
  • 1889

关于淘宝购物车的界面搭建

电商类的都可能会用到购物车,这篇博客就是关于购物车的搭建问题, 首先购物车的展示tableViewCell 、编辑购物车、删除购物车里面的商品、以及选择商品的结算问题, 主要的核心问题就是每次添加商品...
  • dangpf520
  • dangpf520
  • 2016-02-19 10:11
  • 288

高仿淘宝 二级列表固定数据 购物车

转载:http://blog.csdn.net/u013278099/article/details/50822074 前言 做商城类电商app购物车确实一直是一个难点,为什么难呢? ...
  • IT666DHW
  • IT666DHW
  • 2017-12-19 20:05
  • 207

Android开发之浅谈仿淘宝购物车实现(一)

本文来自网络,模仿淘宝购物车界面实现,请看文章!
  • itluochen
  • itluochen
  • 2016-08-11 13:09
  • 643

实现collectionview加载到tableview的tableFooterView上一起滑动(类似淘宝购物车)--通过添加观察者实现

- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view...
  • zhanglizhi111
  • zhanglizhi111
  • 2017-11-09 09:42
  • 71

使用RecycleView加载不同的布局(类似淘宝京东购物车+推荐商品列表)

最近项目中加入了数据统计,也对应的需要在购物车底部加入推荐商品,类似淘宝京东的购物车,上部是购物车列表,下部是推荐商品,如图: 之前我们的购物车用的是ListView,如果修改的话有以下几种方案...
  • Jeff169
  • Jeff169
  • 2017-05-25 16:12
  • 982

仿淘宝购物车demo---增加和减少商品数量

在上一篇博客中,小编简单的介绍了如何使用listview来实现购物车,但是仅仅是简单的实现了列表的功能,随之而来一个新的问题,买商品的时候,我们可能不只想买一件商品,想买多个,或许有因为某种原因点错了...
  • u010850027
  • u010850027
  • 2015-09-22 08:48
  • 5330

淘宝京东购物车价格计算,商品店铺联动js

{% extends 'mobile/include/common_page_template.html' %} {% load xiaozhuang_console_tag %} {% block ...
  • java_goodstudy
  • java_goodstudy
  • 2016-05-26 11:37
  • 1732
    个人资料
    • 访问:12822次
    • 积分:407
    • 等级:
    • 排名:千里之外
    • 原创:28篇
    • 转载:0篇
    • 译文:0篇
    • 评论:12条
    最新评论