最近在最tab页标签,准备用jquery-ui的tabs,但要链接到完整的html页面,jquery-ui的tabs是用div包装了内容,对于是一个完整的html会出现js冲突或不生效的问题,还是在div中添加一个irame 用iframe来显示,但iframe不像div会自动调整高度,但可以根据所加载的内容的高度,在iframe加载完成时,设置高度

 

    function showTab(id){
        var iframe = document.createElement("iframe");
        iframe.src = $("#"+id).attr("url");
        iframe.width="100%";
        iframe.height="500px";
        iframe.setAttribute("frameborder","0");
        iframe.setAttribute("marginwidth","0px");
        iframe.setAttribute("marginheight","0px");
        if (iframe.attachEvent){//IE
            iframe.attachEvent("onload", function(){
                //调整高度
                   iframe.height = $(iframe).contents().find("body").height() + 50;
            });
        }else{//其他浏览器
            iframe.onload = function(){
                iframe.height = $(iframe).contents().find("body").height() + 50;
            };
        }    
        $("#"+id).append(iframe);
    }