lingdublog

select在前端开发过程中很常用,现在我们要实现一个效果,那就是选中select中的某一项,执行事件,本来自己没怎么接触过这些,最后网上找了一些资料,自己研究了一下,把方法分享给大家,大家如果有需要的可以直接拿过去用,当然这个方法在脑残的IE里也是支持的。

我就演示一个简单的效果吧

我要实现select选中里面的第几条,下面相应的li变颜色,下面是html代码:

<select name="" id="sel">
    <option value="1">第一条</option>
    <option value="2">第二条</option>
    <option value="3">第三条</option>
</select>

<ul>
    <li class="cur">第一条</li>
    <li>第二条</li>
    <li>第三条</li>
</ul>

我这里就用jquery实现了,下面是代码:

$(\'#sel\').change(function () {
    $(\'.aaa\').find(\'li\').eq($(this).val()-1).addClass(\'cur\').siblings().removeClass(\'cur\')
})

主要用到了一个change事件,然后改变给相应的li添加class。

PS 如果想要改变select默认的选择项,可以写成这样 $(\'#sel\').val(\'2\'),默认就会选中第二条。

分类:

技术点:

相关文章:

  • 2021-11-21
  • 2021-07-26
  • 2021-11-28
  • 2022-12-23
  • 2022-02-16
  • 2021-10-03
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2021-11-09
  • 2021-12-01
  • 2022-02-03
  • 2021-11-09
  • 2022-12-23
  • 2021-05-22
  • 2022-12-23
相关资源
相似解决方案