jQuery 1.9运行内容而不是显示内容

Question

msoliman在2014年发布了此addTabs替换函数，替代jQuery 1.8中的选项卡（“add”）方法。

var addTab = function (tabs, tabId, tabLabel, tabContentHtml) { 
    var header = "<li><a href='#" + tabId + "'>" + tabLabel + "</a> </li>" 
    tabs.find(".ui-tabs-nav").append(header); 
    tabs.append("<div id='" + tabId + "'><p>" + tabContentHtml + "</p></div>"); 
    tabs.tabs("refresh"); 
}; 

添加新的选项卡

$("#tabs").tabs(); 
addTab($("#tabs"), "tab_id1", "Tab 1", "this is just test"); 

我需要运行的内容，而不是显示它

addTab($("#tabs_area"), "tab_id1", "Tab 1", myHtmlPage.html); 

显然，与周围的文件名引号，文件名只显示为内容。
如何在添加新选项卡而不是显示时导致页面运行？

Answer 1

你可以尝试使用$.get来抓取网页的HTML，像这样：

var addTabFromURL = function (tabs, tabId, tabLabel, tabContentHtml) { 
    $.get(tabContentHtml, function(data) { 
     var header = "<li><a href='#" + tabId + "'>" + tabLabel + "</a> </li>" 
     tabs.find(".ui-tabs-nav").append(header); 
     tabs.append("<div id='" + tabId + "'><p>" + data + "</p></div>"); 
     tabs.tabs("refresh"); 
    }); 
} 

addTabFromURL($("#tabs_area"), "tab_id1", "Tab 1", "myHtmlPage.html"); 

我做了一个新的功能addTabFromURL这反而需要一个相对URL作为最后一个参数。使用$.get，我们可以检索传递的URL的HTML内容，并使用它填充我们的选项卡。

当然，这种方法只适用于假设您试图抓取的页面位于本地子目录内，而不是您无权访问的外部页面。