利用openFrameGroup简单实现tab切换


<div  id="tab">
        <div class="active" id="tab1">菜单1</div>
        <div  id="tab2">菜单2</div>
        <div  id="tab3">菜单3</div>
</div>


apiready = function(){
    api.openFrameGroup ({
        name: 'group',
        scrollEnabled:true,
        index:0,
        frames:
        [{
            name: 'demo1', 
            url: 'demo1.html', 
            bounces:true, 
            vScrollBarEnabled:false,
            hScrollBarEnabled:false
        },{
            name: 'demo2', 
            url: 'demo2.html', 
            bounces:true,
            vScrollBarEnabled:false,
            hScrollBarEnabled:false
        },{
            name: 'demo3', 
            url: 'demo3.html', 
            bounces:true,
            vScrollBarEnabled:false,
            hScrollBarEnabled:false
        }]
    }, function(ret, err){
        var $tab = $api.byId('tab');
        var $tabBar = $api.domAll($tab, 'div');//获取tab下div标签
        for (var j = 0; j < $tabBar.length; j++) {
            //移除全部active
            $api.removeCls($tabBar[j], 'active');
        }
        var index = ret.index;
        if(index==0){
            var $obj = $api.byId('tab1');
            $api.addCls($obj, 'active');
        }else if(index==1){
            var $obj = $api.byId('tab2');
            $api.addCls($obj, 'active');
        }else if(index==2){
            var $obj = $api.byId('tab3');
            $api.addCls($obj, 'active');
        }
    })
}


上一篇 下一篇

评论



赞助商

分享

最新加入

最新评论

admin: 22222222222 查看原文 09月18日 17:01