tu sistema de tabs está diseñado no para cargar contenido externo, sino para definir el contenido en la misma página
Podés utilizar load() de jQuery y valerte del atributo title para identificar el nombre de la página que querés cargar, mirá las lineas 23 y 25
ejemplo
Código HTML:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> <script type="text/javascript"> //<![CDATA[
$(document).ready(function()
{
$(".tab_content").hide();
$("ul.tabs li:eq(0)").addClass("active").show();
$(".tab_content:eq(0)").show();
$("ul.tabs li").click(function()
{
$(".tab_content").hide();
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab_content").hide();
var activeTab = $(this).find("a").attr("href");
var contenidoTab = $(this).find("a").attr("title");
$(activeTab).show();
$(activeTab).load(contenidoTab +".html");
return false;
});
});
//]]>
<li><a href="#tab1" title="ayuda1">1
</a></li> <li><a href="#tab2" title="ayuda2">2
</a></li> <li><a href="#tab3">3
</a></li> <li><a href="#tab4">4
</a></li> <li><a href="#tab5">5
</a></li> <li><a href="#tab6">6
</a></li> <li><a href="#tab7">7
</a></li> <div class="tab_container"> <div id="tab1" class="tab_content"><!-- contenido --></div> <div id="tab2" class="tab_content"><!-- contenido --></div> <div id="tab3" class="tab_content"><!-- contenido --></div> <div id="tab4" class="tab_content"><!-- contenido --></div> <div id="tab5" class="tab_content"><!-- contenido --></div> <div id="tab6" class="tab_content"><!-- contenido --></div> <div id="tab7" class="tab_content"><!-- contenido --></div>
Saludos