首页 > 代码库 > 给导航栏添加停留样式
给导航栏添加停留样式
浅谈下给类似导航栏的东东,添加停留样式的三种方法:
实例:
HTML代码:
<div class="side_layout"> <!--Sidebar content--> <div class="list-group"> <a href=http://www.mamicode.com/"#" class="list-group-item active">项目1 >js代码:方法一:
$(function(){ $(".side_layout a").click(function(){ $(this).addClass('active'); $(this).siblings().removeClass('active'); }); }); 方法二: $(document).on("click", ".side_layout a", function(){ $(this).addClass('active') .siblings().removeClass('active'); }); 方法三: $(function(){ $(".side_layout a").bind('click',function(){ $(this).addClass('active'); $(this).siblings().removeClass('active'); }); });个人认为方法二最方便。方法一和三都需要包含在$(function()内部
方法二、三都是给元素绑定一个单击事件,区别在于$(document).on的方法是把绑定委托到了文档上,二bind方法是委托到了.side_layout a上,据查阅资料,前者效率更好~~~
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。