简单的jquery实现tab切换

    $(document).ready(function(){
        $(".nav-menu-ctn").find("a").click(function(){　　　　　　　　$(this).addClass("active").parent().siblings().children().removeClass("active");　　　　　　　　var index = $(this).index();　　　　　　　　$('.nav-show-panel').hide();　　　　　　　　$('.nav-show-panel:eq('+index+')').show();

　　　　 });　　 })  1.给获取到的元素添加点击事件2.可有可无，样式效果3.获取当前点击元素的索引值4.tab内容全部隐藏，对应的tab元素根据和点击元素相同的索引值来显示

还有一种更简单的办法，而且较上面进一步优化了一些

$(function(){
        var links = $('.nav-menu-ctn').find('a');
        links.click(function(){
            if($(this).attr('data-link')){
                var _id = $(this).attr('data-link');
                $('.nav-show-panel').hide();
                $('#'+_id).show();
            }else{
                return;
            }

        })
    })

1.先获取目标元素a

2.给目标元素添加点击事件

3.html上给目标元素加了一个自定义属性data-link，获取此属性的值

4.自定义属性的值是点击显示对应元素的id值，所以对应的元素显示，其他隐藏即可

5.把这些进行一下判断，如果获取到的a没有data-link属性，这个程序就不跑，退出。