從jquery標籤打開不同的html文件

我一直在嘗試使用jquery標籤來啓動html頁面（在同一頁面內），但不知何故反覆失敗。看起來像一個簡單的事情，但在我的所有嘗試中，標籤停止工作或頁面無法打開。從jquery標籤打開不同的html文件

這是我想要實現的 - 我的index.html頁面帶有多個選項卡（比如a，b，c）。我有單獨的頁面a.html，b.html和c.html編寫，並希望它們在同一頁面（在選項卡下方）打開，使得選項卡無所不在。什麼是最簡單的方法來實現這個工作？我試圖簡單地調用html頁面甚至使用iframe，但似乎沒有任何工作。另外，當我嘗試使用iframe時，框架並未使用可用的頁面的全部高度，但只能說明它的20％（在最新的Firefox中）。

我知道這可能是一個微不足道的問題，可能是由於我的一個愚蠢的錯誤造成的，但我已經花了超過一個星期的時間試圖讓這個工作，現在，我的智慧結束！
任何幫助將不勝感激！
感謝

{編輯的職位，以增加相應的代碼段}

<body> 
    ... 
    <div id="navigation" class="menu"> 
     <ul class="tabNavigation"> 
      <li><a href="#A">A</a></li> 
      <li><a href="#B">B</a></li> 
      <li><a href="#C">C</a></li> 
     </ul> 
    </div> 
    <div> 
     <!--tab contents --> 
     <div class="panes"> 
      <div id="A">A Content<p> tab A content</p> 
      <iframe src="a.html"></iframe></div> 
      <div id="B">B Content <p> tab B content</p> 
      <iframe src="b.html"></iframe></div> 
      <div id="C">C Content<p> tab C content</p> 
      <iframe src="c.html"></iframe></div> 
     </div> 
    </div> 

    <!-- JS to activate the tabs --> 
    <script> 
     $(function() 
     { 
      var tabContainers = $('div.tabs > div'); 
      $('div.tabNavigation ul.tabs a').click(function() 
      { 
       tabContainers.hide(); 
       tabContainers.filter(this.hash).show(); 

       $('div.tabs ul.tabNavigation a').removeClass('selected'); 
       $(this).addClass('selected'); 

       return false; 
      }).filter(':first').click(); 
     }); 
    </script> 
</body>

來源

2011-07-11 Sanjay

請包括相關的代碼片段（例如您的相關HTML和Javascript）。 – ghayes

你是否錯過了div.panes中的一些關閉div？ – Marty

對不起，我不得不重新格式化代碼，使其儘可能簡單（也爲每行添加4個空格使Markdown不能解釋html位是一件痛苦的事情）。最終犯了一些愚蠢的錯誤。所有標籤都在我的官方「非工作」版本中正確關閉！編輯：修復了缺少的關閉div。 – Sanjay

{與特定的代碼編輯} 你可以簡單地把標籤在每一頁上。頁面將重新加載，但標籤將位於相同的位置。

如果重新加載困擾你，你將不得不使用javascript調用html頁面的內容。

該腳本將調用頁面中的html並將html放入具有相應字母的div的窗格中。這應該爲您嘗試使用iframe實現，但當然不包含iframe。

<script type="text/javascript"> 
$(document).ready(function() { 
    $.get("a.html", function(data){ 
     $(#A).append(data); 
    }); 

    $.get("b.html", function(data){ 
     $(#B).append(data); 
    }); 

    $.get("c.html", function(data){ 
     $(#C).append(data); 
    }); 
}); 
</script>

來源

2011-07-11 04:24:12

我想過這樣做，但有兩個問題 - 首先，正如你所說的那樣，頁面將被重新加載，其次（根據我的理解）當前打開的頁面的標籤仍然是可點擊的，這不是那種我正在尋找的行爲。此外，每個打開的選項卡將在我希望避免的URL中使用不同的.html。 – Sanjay

從jquery標籤打開不同的html文件

回答

相關問題