Закладка jQuery и содержимое за пределами текущей веб-страницы

Question

Немного глупого вопроса здесь, но здесь идет ... скажем, я хочу использовать вкладки jQuery, но вместо своих вкладок, указывающих на DIVs на той же странице, я хочу указать их на страницы в пределах моего сайта или даже внешних страниц ... например

<div id="tabs"> 
    <ul> 
     <li><a href="content/page1.html">Page 1</a></li> 
     <li><a href="#profile">Profile</a></li> 
     <li><a href="#photos">Photos</a></li> 
     <li><a href="content/page3.html">Page 3</a></li> 
     <li><a href="content/page4.html">Page 4</a></li> 

    </ul> 
    <div id="profile"> 
     <p>Profile</p> 
    </div> 
    <div id="photos"> 
     <p>Photos</p> 
    </div> 
</div> 

для вкладок, указывающих на Page 3 и Page 4 бы я должен использовать IFrame или Div с плавающим фреймом внутри для отображения нужного контента? Например

<div id="tabs"> 
     <ul> 
      <li><a href="content/page1.html">Page 1</a></li> 
      <li><a href="#profile">Profile</a></li> 
      <li><a href="#photos">Photos</a></li> 
      <li><a href="#page3">Page 3</a></li> 
      <li><a href="#page4">Page 4</a></li> 

     </ul> 
     <div id="profile"> 
      <p>Profile</p> 
     </div> 
     <div id="photos"> 
      <p>Photos</p> 
     </div> 

     <div id="page3"> 
      <iframe></iframe> 
     </div> 

    </div> 

or 

<div id="tabs"> 
<ul> 
    <li><a href="content/page1.html">Page 1</a></li> 
    <li><a href="#profile">Profile</a></li> 
    <li><a href="#photos">Photos</a></li> 
    <li><a href="#page3">Page 3</a></li> 
    <li><a href="#page4">Page 4</a></li> 

</ul> 
<div id="profile"> 
    <p>Profile</p> 
</div> 
<div id="photos"> 
    <p>Photos</p> 
</div> 

    <iframe id="page3"></iframe> 

Если этот вопрос не имеет смысла или моя формулировка плохо скажите, пожалуйста, и я улучшить мой вопрос.

UPDATE **

К сожалению, я должен добавить, что при использовании исходного кода (первый блок) вкладки, что ссылки на страницы, а не DIVs не показаны, когда пользователь использует IE8. IE9 кажется прекрасным ... моя проблема поднялась при тестировании в IE8! Однако закладка первого (указывает на Page1) отображается при загрузке страницы ... когда я нажимаю на Page 3 или Page 4 ссылки ничего не отображается ...

Answer 1

Просто используйте IFrame: <iframe id="page3"></iframe>

Have вы попробовали это и столкнулись с какой-то проблемой?

Answer 2

Если вы используете jQueryUI Tabs, для этого вам необходимо использовать select или show. Например:

$(".selector").tabs({ 
    show: function(event, ui) { 
     // do your stuff with changing attribute `src` of your iframe 
    } 
});