通过eq（i）精确定位遍历的元素中的某个元素的值

我就是我 2022-03-25 11:42 144阅读 0赞

$("\[name=‘hobby’\]").eq(i).siblings(".mid-je").children(“span”).text();  
$("\[name=‘hobby’\]"):定位遍历的元素  
$("\[name=‘hobby’\]").eq(i)：精确定位到所有元素中的某一个

$(function () {
            //点击全选框，选中所有购物车商品
            var  a = 1;
            $("[name= 'all']").click(function () {
                a++;
                //获取选中的订单项金额
                var money = parseInt($("[name='hobby']").siblings(".mid-je").children("span").text());
                //获取当前总计中的金额
                var sum = parseInt($(".jshj-p2").children("span").text());
                if(a % 2 ==0){
                    $("[name='hobby']").attr("checked",true);
                    $("[name='all']").attr("checked",true);
                    var b = document.getElementsByName("hobby");
                    var total = 0 ;
                    for(var i = 0 ; i < b.length ; i++){
                        total = total +  parseInt($("[name='hobby']").eq(i).siblings(".mid-je").children("span").text());
                        console.log(total);
                    }
                    $(".jshj-p2").children("span").text(total);
                }else{
                    $("[name='hobby']").attr("checked",false);
                    $("[name='all']").attr("checked",false);
                    $(".jshj-p2").children("span").text(0);
                }
            });
        });

<c:forEach items="${sessionScope.cart.cartItem}" var="cartI">
            <div class="cart-con-info">
                <div class="info-top">
                </div>
                <div class="info-mid">
                    <input type="checkbox" value="" name="hobby" class="mid-ipt f-l"></input>
                    <div class="mid-tu f-l">
                        <a href="#"><img src="${pageContext.request.contextPath}/images/dai1.gif" /></a>
                    </div>
                    <div class="mid-font f-l">
                        <a href="#">登高阁紫菜肉松鸡蛋卷 海苔蛋卷 糕点<br />江西特产小吃 休闲办公零食</a>
                        <span>满赠</span>
                    </div>
                    <div class="mid-guige f-l">
                        <p>颜色：蓝色</p>
                        <p>尺码：XL</p>
                        <a href="JavaScript:;" class="xg" xg="xg1">修改</a>
                        <div class="guige-xiugai" xg-g="xg1">
                            <div class="xg-left f-l">
                                <dl>
                                    <dt>颜  色</dt>
                                    <dd>
                                        <a href="JavaScript:;" class="current">黑色</a>
                                        <a href="JavaScript:;">白色</a>
                                    </dd>
                                    <div style="clear:both;"></div>
                                </dl>
                                <dl>
                                    <dt>尺  码</dt>
                                    <dd>
                                        <a href="JavaScript:;" class="current">M</a>
                                        <a href="JavaScript:;">L</a>
                                        <a href="JavaScript:;">XL</a>
                                    </dd>
                                    <div style="clear:both;"></div>
                                </dl>
                                <a href="JavaScript:;" class="qd">确定</a>
                                <a href="JavaScript:;" class="qx" qx="xg1">取消</a>
                            </div>
                            <div class="xg-right f-l">
                                <a href="#"><img src="${pageContext.request.contextPath}/images/dai2.gif" /></a>
                            </div>
                            <div style="clear:both;"></div>
                        </div>
                    </div>
                    <div class="mid-sl f-l">
                        <a href="JavaScript:;" class="sl-left" id="${cartI.productExt.pid}" name="reduce">-</a>
                        <input type="number" name="num" id="${cartI.productExt.pid}" value="${cartI.count}" />
                        <a href="JavaScript:;" class="sl-right" id="${cartI.productExt.pid}" name="plus">+</a>
                    </div>
                    <p class="mid-dj f-l">¥ <span>${cartI.price}</span></p>
                    <p class="mid-je f-l">¥ <span>${cartI.sum}</span></p>
                    <div class="mid-chaozuo f-l">
                        <a href="#">移入收藏夹</a>
                        <a href="#">删除</a>
                    </div>
                    <div style="clear:both;"></div>
                </div>
            </div>
        </c:forEach>
    
        <div class="cart-con-footer">
            <div class="quanxuan f-l">
                <input type="checkbox" value="" name="all"></input>
                <span>全选</span>
                <a href="#">删除</a>
                <a href="#">加入收藏夹</a>
                <p>（此处始终在屏幕下方）</p>
            </div>
            <div class="jiesuan f-r">
                <div class="jshj f-l">
                    <p>合计（不含运费）</p>
                    <p class="jshj-p2">
                        ￥：<span>0</span>.00
                    </p>
                </div>
                <a href="JavaScript:;" class="js-a1 f-l">结算</a>
                <div style="clear:both;"></div>
            </div>
            <div style="clear:both;"></div>
        </div>