zoukankan      html  css  js  c++  java
  • 关于easyUI在子页面增加显示tabs的一个问题

    要在子页面上面(也就是tab里面)点击一个按钮调用父页面的tabs新增一个tab方法:转自:http://breezylee.iteye.com/blog/1762811

    在父页面点个链接能动态看到子页面的情况太简单,请看easyUI官网:http://www.jeasyui.com/tutorial/layout/tabs2.php
    现在说的是在子页面点个按钮也能触发增加子页面的情况。
    情景是,在父页面上有个div如:

    Html代码  收藏代码
    1. <div class="easyui-tabs" id="main" fit="true" border="false">  
    2.   <div title="Welcome" iconCls="icon-page" style="padding:20px;overflow:hidden;">    
    3.   </div>  
    4. </div>  

     在子页面上有个

    Html代码  收藏代码
    1. <href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="testAddSubPage('new tab','http://www.baidu.com')">test add subpage</a>    
    2.       

     现在想点这个链接能弹出一个新的tab,tab里面的内容是百度主页。关键的问题来了,就是testAddSubPage这个function怎么写。

    直接这样写是不行的:

    Js代码  收藏代码
    1. function testAddSubPage(title,url){  
    2.               
    3.             var parentMain = window.parent.document.getElementById("main");  
    4.               
    5.             var $main = $(parentMain);  
    6.               
    7.             var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="100%;height:100%;"></iframe>';   
    8.             $main.tabs('add',{  
    9.                     title:title,  
    10.                     content:content,  
    11.                     closable:true  
    12.                 }  
    13.             );  
    14.               
    15.         }  

     这里虽然可以取到父页面那个id为main的div对象,但是把这个dom对象转化为jquery对象$main之后,$main.tabs('add',{...})这个方法死法报错不能通过。

    改正的关键是用top.jQuery这个函数,这个函数具体出外我忘记了,用法看似是取得整个父页面对象,正确是写法:

    Java代码  收藏代码
    1. function testAddSubPage(title,url){    
    2.               
    3.             var jq = top.jQuery;    
    4.         
    5.             if (jq("#main").tabs('exists', title)){    
    6.                 jq("#main").tabs('select', title);    
    7.             } else {  
    8.                   var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="100%;height:100%;"></iframe>';     
    9.                    jq("#main").tabs('add',{    
    10.                                       title:title,    
    11.                                       content:content,    
    12.                                       closable:true    
    13.                                     });    
    14.              }    
    15.         }    

    这样,在子页面点击test add subpage这个链接之后,就会根据传入的url弹出另一个子页面,这里是百度。

     

  • 相关阅读:
    一本通1590恨 7 不成妻
    一本通1591数字计数
    一本通1589不要 62
    一本通1588数字游戏
    一本通1587【例 3】Windy 数
    一本通1586【 例 2】数字游戏
    一本通1585【例 1】Amount of Degrees
    一本通1584骑士
    一本通1583叶子的染色
    一本通1581旅游规划
  • 原文地址:https://www.cnblogs.com/ganbo/p/5647629.html
Copyright © 2011-2022 走看看