active的class类问题

evilmilk Bootstrap 输入框组、... 最后由 green_water 于2017年09月26日回复

  • 1 回答
  • 1.1k 浏览

麻烦老师 那个选中导航栏其中一项 js设置active 如果再a下设置了超链接跳转 那么active的class类就设置不成功了 然后效果也不会显示  这个应该怎么解决啊

  • green_water 2017年09月26日 回答 #1楼
  • 亲爱的evilmilk,并不是设置不成功,而是因为a链接默认会跳转到相应的链接地址,程序运行很快,还来不及看效果,就已经到其他页面了,因此鱼和熊掌不能兼得,你要么阻止a标签默认跳转行为,类似如下代码,要么换其他标签:

    <a id='link' href='http://baidu.com'>baidu.com</a>
    <script>
    var link = document.getElementById('link');
    link.addEventListener('click', function(e){
        e.preventDefault(); // 阻止默认行为
        this.className = 'active'
    })
    </script>

    当然你用jquery 的话,比这个简单,这仅仅是个demo

  • 1 评论