码迷,mamicode.com
首页 > Web开发 > 详细

jquery-ui-1.11.4 tabs 动态添加和关闭

时间:2015-06-08 11:17:57      阅读:493      评论:0      收藏:0      [点我收藏+]

标签:

        var tabs = $( "#tabs" ).tabs();
       var tabCount=0;
         function jqui_addTab(tabid,url,caption){
                if($("#tabs-"+tabid).length==0){
                    tabCount++;
                    var panelId = tabs.find( ".ui-tabs-active" ).attr( "aria-controls" );
                    tabs.find(‘.ui-tabs-active‘).removeClass("ui-tabs-active");
                    $("#tabs-"+panelId).css(‘display‘,‘none‘);
                    var li = ‘<li tabindex="‘+tabCount+‘"><a href="#tabs-‘+tabid+‘">‘+caption+‘</a> <span class="ui-icon ui-icon-close ui-tabs-active" role="presentation" onclick="jqui_closeTab(this)">关闭</span></li>‘;
                    tabs.find( ".ui-tabs-nav" ).append( li );
                    tabs.append( "<div id=‘tabs-" + tabid + "‘><iframe class=‘tabsframe‘ frameborder=‘no‘ border=‘0‘ src=‘"+url+"‘ width=‘100%‘ height=‘"+frameHeight+"px‘></iframe></div>" );
                    tabs.tabs(‘refresh‘);
                    
                    $(‘#tabs‘).tabs(‘option‘, ‘active‘, tabCount);//显示刚刚添加的tab
                }
            }
            function jqui_closeTab(obj){//关闭tab
                var ctlid = $(obj).parent().attr(‘aria-controls‘);
                $("#"+ctlid).remove();
                $(obj).parent().remove();
                tabCount--;
                tabs.tabs(‘refresh‘);
            }

 

jquery-ui-1.11.4 tabs 动态添加和关闭

标签:

原文地址:http://www.cnblogs.com/kdjfkj/p/4560289.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!