注：該插件提取于動(dòng)易CMS系統(tǒng)管理后臺(tái)。

該插件適用于使用框架頁(yè)的管理系統(tǒng)后臺(tái)。

該插件只能應(yīng)用于同域的URL，跨域的URL由于Javascript的安全限制，會(huì)出錯(cuò)。

下面是代碼，有注釋，就不多說(shuō)了。

/*  ** 該插件只能應(yīng)用于同域的URL，跨域的URL由于Javascript的安全限制，會(huì)出錯(cuò)。** 新建一個(gè)標(biāo)簽：PE_FrameTab.AddNew(url); 如果url為空則是新開(kāi)一個(gè)空白的標(biāo)簽頁(yè)。* 關(guān)閉當(dāng)前標(biāo)簽：PE_FrameTab.CloseCurrentTab()* 從當(dāng)前標(biāo)簽切換到其他標(biāo)簽時(shí)觸發(fā)：BeforeSwitch(); 如果該函數(shù)存在并返回false則不切換標(biāo)簽.該函數(shù)直接寫(xiě)
在當(dāng)前頁(yè)面中.* 從其他標(biāo)簽切換到當(dāng)前標(biāo)簽時(shí)觸發(fā)：SwitchInto(); 如果該函數(shù)存在則執(zhí)行.該函數(shù)直接寫(xiě)在要切換到的頁(yè)面.* 在關(guān)閉當(dāng)前標(biāo)簽頁(yè)的時(shí)候觸發(fā)：OnCloseTab(); 如果該函數(shù)存在存在則執(zhí)行.該函數(shù)直接寫(xiě)在當(dāng)前頁(yè)面中.*/var lastFrameTabId = 1; //最后新建的FrameTabId，用于新建FrameTabvar currentFrameTabId = 1; //當(dāng)前顯示的FrameTabvar frameTabCount = 1;var StyleSheetPath ="";var PE_FrameTab = {    //新建一個(gè)標(biāo)簽    AddNew: function(url) {        AddNewFrameTab(url);    },    //關(guān)閉當(dāng)前標(biāo)簽    CloseCurrentTab: function(){        jQuery("#iFrameTab" + currentFrameTabId).find(".closeTab").click();   }};///給tab標(biāo)簽注冊(cè)切換和關(guān)閉tab事件jQuery.fn.iFrameTab = function() {    jQuery(this).each(function() {        var cr = jQuery(this);        var tabId = cr.attr("id").replace("iFrameTab", "");        cr.click(function() {//切換FrameTab            SwitchIframe(this);        }).find(".closeTab").click(function() {//關(guān)閉FrameTab            if (frameTabCount > 1) {                var mainRightFrame = jQuery("#main_right_frame iframe[tabid='" + tabId + "']");                var bClose = mainRightFrame[0].contentWindow.OnCloseTab ? mainRightFrame[0].c
ontentWi
ndow.OnCloseTab() : true;                if (bClose) {                    if (cr.attr("class") == "current") {//如果關(guān)閉的標(biāo)簽是當(dāng)前標(biāo)簽，則切換到前一標(biāo)簽，如果前
一標(biāo)簽不存在，則切換到后一標(biāo)簽                        var nextIframe = cr.prev("li[id^='iFrameTab']");                        if (nextIframe.length <= 0) { nextIframe = cr.next("li[id^='iFrameTab']"); }                        SwitchIframe(nextIframe[0]);                    }                    //清理                    cr.remove();                    jQuery("#frmTitle iframe[tabid='" + tabId + "']").remove();                    mainRightFrame.remove();                    frameTabCount--;                    CheckFramesScroll();                }            }        }).end().dblclick(function() {            jQuery(this).find(".closeTab").click();        });    });    return jQuery(this);}///切換tabfunction SwitchIframe(iFrameTab) {    var tabId = jQuery(iFrameTab).attr("id").replace("iFrameTab", "");  //鼠標(biāo)點(diǎn)擊的tab的id    if (currentFrameTabId == tabId) { return false; }    //判斷是否允許切換Tab    var switchFunc = jQuery("#main_right")[0].contentWindow.window.BeforeSwitch;    var bSwitch = (switchFunc) ? switchFunc() : true;    if (!bSwitch) { return false; }    var currentGuideSrc = jQuery("#frmTitle iframe[tabid='" + currentFrameTabId + "']").attr("src");    SetCurrentFrameTab(iFrameTab);    var mainFrames = jQuery("#main_right_frame > iframe").hide().attr({ "id": "", "name": "" });    var newMainFrame = jQuery("#main_right_frame iframe[tabid='" + tabId + "']");    //將iframe的window.name設(shè)為空，使只對(duì)當(dāng)前iframe有效    mainFrames.each(function() { this.contentWindow.window.name = ""; });     if (newMainFrame.length <= 0) {//是否新建標(biāo)簽        newMainFrame = jQuery("#main_right_frame").prepend(jQuery("#iframeMainTemplate").html())                .find("[tabid=0]").attr({ "tabid": tabId, "src": "about:blank", "id": "main_right", "name": "main_right" })                .css("display", "block");    } else {        newMainFrame = jQuery("#main_right_frame iframe[tabid='" + tabId + "']")            .attr("id", "main_right").attr("name", "main_right").show();    }    //指定iframe的window.name，使有效    newMainFrame[0].contentWindow.window.name = "main_right";    frames["main_right"] = newMainFrame[0].contentWindow.window;    currentFrameTabId = tabId;    var switchInto = jQuery("#main_right")[0].contentWindow.window.SwitchInto;    if(switchInto){ switchInto(); }}///初始化新建標(biāo)簽按鈕function InitNewFrameTab() {    jQuery("#newFrameTab").click(function(url) {        AddNewFrameTab(url);    });}function AddNewFrameTab(url){    //jQuery("#FrameTabs .current").removeClass("current");    var btn=jQuery("#newFrameTab");    jQuery('
'" >(無(wú)標(biāo)題)'images/tab-close.gif"/>
')            .insertBefore(btn).iFrameTab();      frameTabCount++;      SwitchIframe(jQuery("#iFrameTab" + lastFrameTabId)[0]);       jQuery("#main_right").attr("src",url);      if (CheckFramesScroll()) { jQuery("#FrameTabs ul:eq(0)").css("margin-left", cW - fW - 40); }}function SetCurrentFrameTab(selector) {    jQuery("#FrameTabs .current").removeClass("current");    jQuery(selector).addClass("current");}///檢查是否需要滾動(dòng)function CheckFramesScroll() {    var ft = jQuery("#FrameTabs");    window.cW = ft.width(); //包含Tabs的容器寬度    window.fW = ft.find("ul:eq(0)").width();    ft.unbind("DOMMouseScroll").unbind("mousewheel");    if (fW > cW) {        if (jQuery.browser.mozilla) {            ft.bind("DOMMouseScroll", function(e) {                ScrollFrames(cW, fW, e);            });        } else {            ft.bind("mousewheel", function(e) {                ScrollFrames(cW, fW, e);            });        }        jQuery("#FrameTabs .tab-strip-wrap").addClass("tab-strip-margin");        jQuery("#FrameTabs .tab-right, #FrameTabs .tab-left").css("display", "block");        return true;    } else {        jQuery("#FrameTabs ul:eq(0)").css("margin-left", 0);        jQuery("#FrameTabs .tab-right, #FrameTabs .tab-left").css("display", "none");        jQuery("#FrameTabs .tab-strip-wrap").removeClass("tab-strip-margin");        return false;    }}///Tab滾動(dòng)。///cW為包含Tabs的容器寬度；fW為全部Tabs的寬度；y為指定的位移，如果不指定y，則使用event中的位移。function ScrollFrames(cW, fW, event, y) {    if (!y) {        if (event.wheelDelta) {            y = event.wheelDelta / 5;        } else if (event.detail) {            y = -event.detail * 8;        }    }    var jList = jQuery("#FrameTabs ul:eq(0)");    var ml = jList.css("margin-left");    ml = Number(ml.toLowerCase().replace("px", ""));    if ((ml < 0 && y > 0) || (ml - cW > -fW - 40) && y < 0) {        ml = ml + y;        if (ml >= 0) { ml = 0; }        if (ml - cW <= -fW - 40) { ml = cW - fW - 40;}        jList.css("margin-left", ml);    }}//注冊(cè)Tab超出范圍時(shí)左移、右移事件function RegScrollFramesBtn() {    jQuery("#FrameTabs .tab-right").click(function() {         ScrollFrames(window.cW,window.fW,null,-50);    });    jQuery("#FrameTabs .tab-left").click(function() {         ScrollFrames(window.cW,window.fW,null,50);    });}//設(shè)置標(biāo)簽的標(biāo)題//tarFrame參數(shù)為目標(biāo)iframefunction SetTabTitle(tarFrame) {    var title = "";    try { title = tarFrame.contentWindow.document.title; } catch (e) { }    var subTitle = title = title || "(無(wú)標(biāo)題)";    if (title.length > 6) { subTitle = title.substr(0, 5) + ".." }    jQuery("#iFrameTab" + jQuery(tarFrame).attr("tabid")).find("#frameTabTitle").html(subTitle).attr("title", title);}//初始化jQuery(function() {    jQuery("#FrameTabs li[id^='iFrameTab']").iFrameTab();    InitNewFrameTab(); //初始化新建標(biāo)簽頁(yè)按鈕    RegScrollFramesBtn();});

Enjoy!! By Q.Lee.lulu。

最后給出代碼打包下載：FrameTab.rar

it知識(shí)庫(kù)：發(fā)一個(gè)基于jQuery的多標(biāo)簽瀏覽插件，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。