博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
easyui 在子tabs中打开新tabs(关于easyUI在子页面增加显示tabs的一个问题)
阅读量:5041 次
发布时间:2019-06-12

本文共 1244 字,大约阅读时间需要 4 分钟。

现在说的是在子页面点个按钮也能触发增加子页面的情况。 情景是,在父页面上有个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" οnclick="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+'" ></iframe>';   
  8.             $main.tabs('add',{  
  9.                     title:title,  
  10.                     content:content,  
  11.                     closable:true  
  12.                 }  
  13.             );  
  14.               
  15.         }  

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

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

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+'" ></iframe>';     
  9.                    jq("#main").tabs('add',{    
  10.                                       title:title,    
  11.                                       content:content,    
  12.                                       closable:true    
  13.                                     });    
  14.              }    
  15.         }    
 
 

转载于:https://www.cnblogs.com/suxiaBlogs/p/7069959.html

你可能感兴趣的文章
Hibernate一对多、多对一关联
查看>>
一、记录Git使用中遇到的问题及解决方法
查看>>
学习网址
查看>>
前端表格插件datatables
查看>>
内部类
查看>>
树链剖分入门
查看>>
图解算法时间复杂度
查看>>
UI_搭建MVC
查看>>
一个样例看清楚JQuery子元素选择器children()和find()的差别
查看>>
代码实现导航栏分割线
查看>>
Windows Phone开发(7):当好总舵主 转:http://blog.csdn.net/tcjiaan/article/details/7281421...
查看>>
ASP.Net页面和控件缓存设置
查看>>
SEO第一步做什么
查看>>
Python-01作业(登录和三级菜单)
查看>>
spring-qualifier解释
查看>>
URL参数中文乱码解决
查看>>
VS 2010打开设计器出现错误
查看>>
SQLServer 镜像功能完全实现
查看>>
Vue-详解设置路由导航的两种方法
查看>>
一个mysql主从复制的配置案例
查看>>