tab选项卡跳转,在iframe里面新建选项卡和跳转选项卡

来源:互联网 发布:react数据传递 编辑:程序博客网 时间:2024/06/03 21:10
第一种以href链接的方式:
[javascript] view plain copy
  1. function addTab(title, url){  
  2.             if ($('#tt').tabs('exists', title)){  
  3.                 $('#tt').tabs('select', title);  
  4.             } else {  
  5.                 $('#tt').tabs('add',{  
  6.                     title:title,  
  7.                     href:url,     //tab中显示的内容  
  8.                     closable:true  
  9.                 });  
  10.             }  
  11.         } 
第二种以iframe的方式:
  1. function addTab(title, url){  
  2.             if ($('#tt').tabs('exists', title)){  
  3.                 $('#tt').tabs('select', title);  
  4.             } else {  
  5.                 var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';  
  6.                 $('#tt').tabs('add',{  
  7.                     title:title,  
  8.                     content:content,   //tab中显示的内容  
  9.                     closable:true  
  10.                 });  
  11.             }  
  12.         }  

想要实现点击tab内容中的链接,在父级中tab上新增一个tab的话,须以iframe方式来添加父级tab。

在tab内容中,即url页面中,需要在链接上实现下面这个方法:

[javascript] view plain copy
  1. function add(title,url){   //title 选项卡的名字 //url 选项卡的链接地址
        var parent$ = self.parent.$;      //找到父级DOM  
        if (parent$('#tabs').tabs('exists', title)){  
        parent$('#tabs').tabs('select', title);  
        } else {  
            var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';  
            parent$('#tabs').tabs('add',{  
                title:title,  
                content:content,   //tab中显示的内容  
                closable:true  
            });  
        }  
    }
原创粉丝点击