jq下拉框ul搜索数据

最新推荐文章于 2024-09-07 22:49:05 发布

前端路上迷茫的小鲨鱼

最新推荐文章于 2024-09-07 22:49:05 发布

阅读量315

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/Guoyu1_/article/details/100703771

版权

js 专栏收录该内容

83 篇文章 1 订阅

订阅专栏

<div>
        <select class="select">
            <option value="2019">2019</option>
            <option value="2018">2018</option>
            <option value="2017">2017</option>
        </select>
    </div>
 
<div>
    <ul class="sileUl" id="2019">
        <li>
            <div>2019</div>
        </li>
    </ul>
    <ul style="display: none;" class="sileUl" id="2018">
        <li class="content">
            <div>2018</div>
        </li>
    </ul>
    <ul style="display: none;" class="sileUl" id="2017">
        <li class="content">
            <div>2017</div>
        </li>
    </ul>
</div>
<script>
    $(function(){
        $(".select").change(function () {
            var  selectId=$(this).val();  /*当前点击option里value的值*/
            $('.sileUl').fadeOut();    /*将class=sileUL的隐藏*/
            $("#"+selectId).fadeIn();/*将id=value显示*/
        })
    })
</script>