今天同事接到一个类似于JD的按条件筛选商品的功能，同事把这个锅出色的甩给了我，俺就勉为其难的解决了这个问题。

首先我们来理清一下思路：

    1.条件切换时，tab选项卡肯定要跟着切换，而且只是一个大类条件下的切换。

    2.当选中筛选条件时我们要获取到其对应的属性值重新给url赋值。

    3.页面刷新后，我们要根据url参数去给对应的筛选条件加上被选中的样式。

完成后的效果图

    

下面我们开始写代码实现：

    1.首先是HTML部分

    2.css部分

    3.js(使用的是jquery-1.8.0.min.js版本)

OK，到这里就算初步大功告成了(PS:没有做清除筛选条件，有兴趣的小伙伴可自行研究下)，这里的重点是获取已选中的条件组成新的ur。本人第作为一个研发后端第一次来简书写前端帖子，献丑的地方请各位大神见谅。