jQuery中的列表点击时改变Class位置，修改css 样式

版权声明：本文为博主原创文章，转载请注明作者和出处，如有错误，望不吝赐教。 https://blog.csdn.net/weixin_41888813/article/details/82385438

 需求效果如下：

---

jQuery思路：

点击当前li元素后是用removeClass()删除所有兄弟元素（使用siblings()获取）的class样式，

然后使用addClass()为当前的 li 添加class，从而达到了切换class的位置。

---

HTML结构

<ul id="test">
	<li class="expert_city_active">
            <p><a style="cursor:pointer;" @click=" queryExpertByCity()">不限城市</a></p>
        </li>
        <li>
            <p><a style="cursor:pointer;" @click=" queryExpertByCity('1000000200')">广州</a></p>
        </li>
</ul>

---

jquery代码

$(function(){
    $('.expert_city ol li').click(function(event) {
        $(this).addClass('expert_city_active');
        $(this).siblings().removeClass('expert_city_active');
    });
    $('.medicine ol li').click(function(event) {
        $(this).addClass('medicine_active');
        $(this).siblings().removeClass('medicine_active');
    })
})

---

以上是使用jQuery实现的方法；

如果在Vue中可以直接使用 :class绑定

https://blog.csdn.net/weixin_41888813/article/details/82385849