tabs-關於easyui tab iframe 高度問題

關於easyui tab iframe 高度問題

$(function() {
    for ( var i = 0; i < 1; i++) {
        addTab(i, 'http://www.163.com');
    }
});
function addTab(subtitle, url) {
    if (!$('#tabs').tabs('exists', subtitle)) {
        $('#tabs').tabs('add', { 
            title: subtitle,
            content: createFrame(url),
            closable: true 
        });
        $('#tabs').tabs('getSelected').css('width', 'auto'); 
        //重新tab body寬度為auto，如果你上面的添加語句設置了selected為false，注意使用下面注釋的這句來獲取你的tab
        //$('#tabs').tabs('getTab', subtitle).css('width', 'auto');
    }
    tabClose();
    $('#tabs').tabs('getSelected').css('width', 'auto'); 
}

function createFrame(url) {
    var s = '<iframe scrolling="auto" frameborder="0"  src="' + url
            + '" style="width:100%;height:100%;"></iframe>';
    return s;
}

function tabClose() {
    /*雙擊關閉TAB選項卡*/
    $(".tabs-inner").dblclick(function() {
        var subtitle = $(this).children("span").text();
        $('#tabs').tabs('close', subtitle);
    });
}

    <div title="歡迎使用" style="padding: 20px; overflow: hidden;height: auto;width: 100px;" id="home">

        <h1>
            <a href="javascript:addTab('test','addTDemo.jsp');">111</a>
        </h1>

    </div>

</div>

 運行後的代碼

style="width: auto; height: auto;">



style="margin-left: 0px; left: 0px; width: 1598px;">

• class="tabs-inner">歡迎使用 class="tabs-icon">
  
  


• class="tabs-title tabs-closable">0
  
  

        <div class="panel" style="display: block; width: auto;">
            <div title=""
                style="padding: 20px; overflow: hidden; height: auto; width: 1558px;"
                id="home"
                class="panel-body panel-body-noheader panel-body-noborder">

                <h1>
                    <a href="javascript:addTab('test','addTDemo.jsp');">111</a>
                </h1>

            </div>
        </div>

        <div class="panel" style="display: none; width: auto;">
            <div title=""
                class="panel-body panel-body-noheader panel-body-noborder"
                style="width: 1598px; height: auto;">
                <iframe scrolling="auto" frameborder="0" src="http://www.163.com"
                    style="width:100%;height:100%;"></iframe>
            </div>
        </div>
    </div>
</div>

""

高度很低。

最佳回答：

已經解決。去掉tabs的class，在JS裡寫
$("#tabs").tabs({
width:$("#tabs").parent().width(),
height:$("#tabs").parent().height()
});