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

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

     HTML
    <div class="easyui-tabs" id="main" fit="true" border="false">  
      <div title="Welcome" iconCls="icon-page" style="padding:20px;overflow:hidden;">    
      </div>  
    </div> 

     在子页面上有个

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

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

    直接这样写是不行的:

    Js代码
        function testAddSubPage(title,url){  
        var parentMain = window.parent.document.getElementById("main");  
        var $main = $(parentMain);  
        var content = '';   
                    $main.tabs('add',{  
                            title:title,  
                            content:content,  
                            closable:true
                        }  
                    );  
                }  

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

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

    Jquery代码
    1. function testAddSubPage(title,url){    
                  var jq = top.jQuery;    
      if (jq("#main").tabs('exists', title)){    
                      jq("#main").tabs('select', title);    
                  } else {  
                        var content = '';     
                         jq("#main").tabs('add',{    
                                            title:title,    
                                            content:content,    
                                            closable:true
                                          });    
                   }    
              }  
       

    这样,在子页面点击test add subpage这个链接之后,就会根据传入的url弹出另一个子页面,这里是百度。
    本文摘自:http://breezylee.iteye.com/blog/1762811

  • 相关阅读:
    Mapbox GL JS使用小结(一)
    js 跳转链接的几种方式
    使用iis 部署 .net项目遇到的问题
    ROS 导入示例程序并建立工程运行
    C# WPF程序增加终端串口打印调试信息
    C# 继承方法重写调用测试
    C# 迭代器实现
    C# 引用和值都按照引用传递(其实传递的就是指针)
    C# string引用类型参数不变性
    C# 值类型和引用类型
  • 原文地址:https://www.cnblogs.com/ftm-datablogs/p/5364060.html
Copyright © 2011-2022 走看看