加載其他頁面的標籤面板部分

我使用jquery ui選項卡。我想在某個標籤的面板中顯示其他頁面的一部分（page.html，它位於同一個文件夾中）。這裏是page.html加載其他頁面的標籤面板部分

<html> 
<head> 
<head> 
<body> 
    <div id="content1"> 
     <p>Page.html content 1</p> 
    </div> 
    <div id="content2"> 
     <p>Page.html content 2</p> 
    </div> 
</body> 
</html>

這裏是用標籤

<html> 
<head> 
    <meta charset="utf-8" /> 
    <link rel="stylesheet" href="jquery-ui-themes-1.10.3/themes/black-tie/jquery-ui.css" /> 
    <script src="jquery-ui-1.10.3/jquery-1.9.1.js"></script> 
    <script src="jquery-ui-1.10.3/ui/jquery-ui.js"></script> 
    <script> 
     $(function() { 
      $("#tabs").tabs().addClass("ui-tabs-vertical ui-helper-clearfix"); 
      $("#tabs li").removeClass("ui-corner-top").addClass("ui-corner-left"); 
      $("#tabs").tabs({ 
       event: "mouseover" 
      }); 
     }); 
    </script> 
    <style> 
     .ui-tabs-vertical { width: 55em; } 
     .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; } 
     .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; } 
     .ui-tabs-vertical .ui-tabs-nav li a { display:block; } 
     .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; } 
     .ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;} 
    </style> 
</head> 
<body> 
    <div id="tabs"> 
     <ul> 
      <li> 
       <a href="/page.html#content1">Elem 1</a> 
      </li> 
      <li> 
       <a href="#">Elem 2</a> 
      </li> 
      <li> 
       <a href="#">Elem 3</a> 
      </li> 
     </ul> 
    </div> 
</body> 
</html>

但elem1面板始終是清晰的頁面。哪裏有問題？

來源

2013-07-22 lapots

如果它與您正在運行的腳本位於相同的文件夾中，則該路徑在開始處不應該有一個/。 /page.html將在您的服務器根目錄中查找page.html。

來源

2013-07-22 16:15:58

加載其他頁面的標籤面板部分

回答

相關問題