jquery select change搜索div中文档

最新推荐文章于 2024-09-26 13:58:48 发布

原创最新推荐文章于 2024-09-26 13:58:48 发布 · 178 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

83 篇文章

订阅专栏

<div class="content" style="padding-bottom: 0;margin-bottom: 0.5rem;">
<span style="float: left;display:block;font-size: 0.3rem;font-weight: inherit;vertical-align: middle;line-height: 0.5rem">时间</span>
<select class="select" style="margin-left: 0.15rem;float: right; padding: 0.08rem 1.9rem;font-size: 0.24rem; border: 0.01rem solid #5968ef; border-radius: 0.1rem;vertical-align: middle;">
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
</select>
</div>

<ul>
<li class="title">时间</li>
<li class="title">缴纳基数</li>
<li class="title">单位缴纳</li>
<li class="title">个人缴纳</li>
</ul>
<ul class="sileUl" id="2019">
<li class="content">
<div class="content_txt content_txt1"><span>2019</span></div>
<div class="content_txt content_txt2"><span class="sp">3010.00</span></div>
<div class="content_txt content_txt3"><span class="sp">590.40</span></div>
<div class="content_txt content_txt4"><span class="sp">250.30</span></div>
</li>
...
</ul>
<ul style="display: none;" class="sileUl" id="2018">
<li class="content">
<div class="content_txt content_txt1"><span>2018</span></div>
<div class="content_txt content_txt2"><span class="sp">3010.00</span></div>
<div class="content_txt content_txt3"><span class="sp">590.40</span></div>
<div class="content_txt content_txt4"><span class="sp">250.30</span></div>
</li>
...
</ul>
<ul style="display: none;" class="sileUl" id="2017">
<li class="content">
<div class="content_txt content_txt1"><span>2017</span></div>
<div class="content_txt content_txt2"><span class="sp">3010.00</span></div>
<div class="content_txt content_txt3"><span class="sp">590.40</span></div>
<div class="content_txt content_txt4"><span class="sp">250.30</span></div>
</li>
...
</ul>
<script>
$(function(){
   $(".select").change(function () {
      var selectId=$(this).val();       /*当前点击option里value的值*/
      $('.sileUl').fadeOut();           /*将class=sileUL的隐藏*/
      $("#"+selectId).fadeIn();         /*将id=value显示*/
   })
})
</script>
</body>
</html>