在父頁面點個連結能動态看到子頁面的情況太簡單，請看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>
在子頁面上有個
<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 = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>';
$main.tabs('add',{
title:title,
content:content,
closable:true
}
);
}
這裡雖然可以取到父頁面那個id為main的div對象，但是把這個dom對象轉化為jquery對象$main之後，$main.tabs('add',{...})這個方法死法報錯不能通過。
改正的關鍵是用top.jquery這個函數，這個函數具體出外我忘記了，用法看似是取得整個父頁面對象，正确是寫法：
java代碼
function testaddsubpage(title,url){
var jq = top.jquery;
if (jq("#main").tabs('exists', title)){
jq("#main").tabs('select', title);
} else {
var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>';
jq("#main").tabs('add',{
title:title,
content:content,
closable:true
});
}
}
這樣，在子頁面點選test add subpage這個連結之後，就會根據傳入的url彈出另一個子頁面，這裡是百度。
檢視圖檔附件
頁面增加顯示tabs的一個問題