切换tab
使用eq()函数
eq() 方法将匹配元素集缩减值指定 index 上的一个。
//为项目 3 设置红色背景
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
$('li').eq(2).css('background-color', 'red');
eq(index)中index可为正数，负数（倒序），超过已有length（不显示）
eg
<style>
.container{
width: 400px;
margin: 40px auto
}
.title{
width: 100%;
border:1px solid black;
}
span{
width: 49%;
text-align: center;
display: inline-block;
cursor: pointer;
}
.current{
color:red
}
.content{
height: 200px;
background-color: aliceblue;
}
.content>div:nth-child(2){
display: none;
}
</style>
<body>
<div class="container">
<div class="title">
<span class="current">tab1</span>
<span>tab2</span>
</div>
<div class="content">
<div>tab1内容</div>
<div>tab2内容</div>
<div>
</div>
</body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//点击切换登录方式
$('.title').on('click','span',function () {
$(this).addClass('current');
$(this).siblings().removeClass('current');
var i =$(this).index();
$('.content>div').eq(i).show().siblings().hide();
})
</script>
效果如下
tab1
tab2