`
caiceclb
  • 浏览: 239356 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

jquery使用index()方法轻松实现tabs切换

阅读更多

163的tabs很简单,但是参数多,这里用jquery不用参数即可tabs,也很简单。

 

话说最近在用index()实现tabs,代码也不多:

 

$(function(){
    var $title = $("h3 a");
    var $content = $("div");
    $title.mousemove(function(){
        var index = $title.index($(this));
        $content.hide();
        $($content.get(index)).show();

        return false;
    });
});

 

 

/* 这是js写法,下面给你相应的html结构,当然css要定义div第一个显示,其他隐藏才行 */

<h3>
<a href="#">选择1</a>
<a href="#" >选择2</a>
<a href="#">选择3</a>
<a href="#" >选择4</a>
</h3>

<div>选择1的内容</div>
<div>选择2的内容</div>
<div>选择3的内容</div>
<div>选择4的内容</div>

 

分享到:
评论
1 楼 hyxj1220 2011-12-20  
js代码中  var index = $title.index($(this));  这里的$(this)可以去掉$(),直接this就可以 ,

相关推荐

Global site tag (gtag.js) - Google Analytics