首页 > Web开发 > 详细

jquery: siblings使用删除当前样式,添加所有siblings样式

时间:2020-06-20 12:58:57      阅读:70      评论:0      收藏:0      [点我收藏+]

html:

<div class="hot-purchase">
                    <div class="title">热门团购</div>
                    <dl class="item on">
                        <dt>
                            <a href="" class="text-area">[text]</a>
                            <a href="" class="text-name">title</a>
                            <span class="price">13000</span>
                        </dt>
                        <dd class="tag-1">
                            <span class="tag">title</span>
                            <span class="description">test</span>
                        </dd>
                        <dd class="tag-2 clearfix">
                            <div class="picture-left fl">
                                <a href=""><img src="../images/consult_hot_purchase.jpg" alt=""></a>
                            </div>
                            <div class="content-right fl">
                                <p>description</p>
                                <a href="">link</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="item">
                        <dt>
                            <a href="" class="text-area">[text]</a>
                            <a href="" class="text-name">title</a>
                            <span class="price">13000</span>
                        </dt>
                        <dd class="tag-1">
                            <span class="tag">title</span>
                            <span class="description">test</span>
                        </dd>
                        <dd class="tag-2 clearfix">
                            <div class="picture-left fl">
                                <a href=""><img src="../images/consult_hot_purchase.jpg" alt=""></a>
                            </div>
                            <div class="content-right fl">
                                <p>description</p>
                                <a href="">link</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="item">
                        <dt>
                            <a href="" class="text-area">[text]</a>
                            <a href="" class="text-name">title</a>
                            <span class="price">13000</span>
                        </dt>
                        <dd class="tag-1">
                            <span class="tag">title</span>
                            <span class="description">test</span>
                        </dd>
                        <dd class="tag-2 clearfix">
                            <div class="picture-left fl">
                                <a href=""><img src="../images/consult_hot_purchase.jpg" alt=""></a>
                            </div>
                            <div class="content-right fl">
                                <p>description</p>
                                <a href="">link</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="item">
                        <dt>
                            <a href="" class="text-area">[text]</a>
                            <a href="" class="text-name">title</a>
                            <span class="price">13000</span>
                        </dt>
                        <dd class="tag-1">
                            <span class="tag">title</span>
                            <span class="description">test</span>
                        </dd>
                        <dd class="tag-2 clearfix">
                            <div class="picture-left fl">
                                <a href=""><img src="../images/consult_hot_purchase.jpg" alt=""></a>
                            </div>
                            <div class="content-right fl">
                                <p>description</p>
                                <a href="">link</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="item">
                        <dt>
                            <a href="" class="text-area">[text]</a>
                            <a href="" class="text-name">title</a>
                            <span class="price">13000</span>
                        </dt>
                        <dd class="tag-1">
                            <span class="tag">title</span>
                            <span class="description">test</span>
                        </dd>
                        <dd class="tag-2 clearfix">
                            <div class="picture-left fl">
                                <a href=""><img src="../images/consult_hot_purchase.jpg" alt=""></a>
                            </div>
                            <div class="content-right fl">
                                <p>description</p>
                                <a href="">link</a>
                            </div>
                        </dd>
                    </dl>
                </div>

js: 

$(document).ready(function () {
        $(‘.consult-right .hot-purchase .item‘).each(function (index) {
            $(this).hover(function () {
                $(this).addClass(‘on‘);
                let siblings = $(this).siblings(‘.item‘);
                siblings.removeClass(‘on‘)
            })
        })
    })

 

jquery: siblings使用删除当前样式,添加所有siblings样式

原文:https://www.cnblogs.com/Nyan-Workflow-FC/p/13168176.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!