Jquery選項卡在選項卡中加載當前網址

使用jQuery的UI選項卡。這是我的代碼。Jquery選項卡在選項卡中加載當前網址

<div id="tabs"> 
    <ul> 
    <li><a href="#tabs-1">Find a Category</a></li> 
    <li><a href="#tabs-2">Business Name</a></li> 
    <li><a href="#tabs-3">All Categories</a></li> 
    <li><a href="#tabs-4">Business to Business</a></li> 
    </ul> 
    <div style="clear:both;"></div> 
    <div id="tabs-1"><p>Tab 1</p></div> 
    <div id="tabs-2"><p>Tab 2</p></div> 
    <div id="tabs-3"><p>Tab 3</p></div> 
    <div id="tabs-4"><p>Tab 4</p></div> 
    </div> 
</div>

發起這樣的...

$(function() { 
    $('#tabs').tabs(); 
});

我的網站上的一些網頁它完美的作品。在其他頁面上，href="#tabs-x"被預置爲頁面的路徑，例如， <a href="#tabs-1">Find a Category</a>變成<a href="/page/path/#tabs-1">Find a Category</a>（在這種情況下，頁面將在/ page/path /中找到）。發生這種情況時，它認爲它需要使用Ajax並最終將頁面重新加載到選項卡中。

真奇怪的是，它不會發生在每一頁上（儘管它在大多數頁面上都會發生）。例如

http://cbpstage.eblairsolutions.net/online/all-categories/- 偉大工程 http://cbpstage.eblairsolutions.net/online/business-to-business/ - 失敗。

我已驗證頁面（它們不完美，但以完全相同的方式失敗）。我使用IDM的ultracompare比較了它們。它們是不同的頁面，所以存在一些差異，但沒有任何材料可以檢測到導致href的行爲不同。

我已經花了整整一天的時間，只有一個禿頂的頭顯示它。會愛別人看這個。

來源

2010-08-21 Chris Blair

你用什麼語言來生成這些頁面？它只是靜態的HTML，還是ASPX或PHP或其他？另外，你的選項卡div是靜態還是由代碼生成（意味着你正在從db中讀取某些內容並動態地構建div）？ – 2010-08-21 23:43:30

它是PHP，Typo3 CMS（v4.4）。儘管如此，我仍在使用靜態代碼。最終它會變得更加複雜，但我故意讓它陷入故障排除。 – 2010-08-22 00:02:24

如果你在提取一個靜態代碼塊，這是否意味着你的'href'是'＃tabs-X'，然後以某種方式被替換爲'/ page/path /＃tabs-X'？奇怪的。我不是PHP開發人員，所以我不確定我可以在那裏幫忙。 – 2010-08-22 03:09:56

D Hoerster是在正確的軌道上。路徑似乎來自服務器。要麼你跟蹤它，或者你可以在你的$('#tabs').tabs(...聲明之前添加下面的jQuery：

$('#tabs a').each(function(){ 
    $(this).attr('href',"#"+$(this).attr('href').split('#')[1]); 
});

編輯：新增"#"+

來源

2010-08-22 00:47:41

這確實殺死了直到＃點的路徑。但是，標籤插件不能識別內容div，並且正在編寫它自己的內容。＃tab-1，＃tab-2被忽略。 href生成爲＃ui-tabs-1，＃ui-tabs-2等。然後它創建具有相同ID的空白內容div - 就好像它將要發起ajax調用一樣。不拉入頁面，但它會忽略我的內容。 – 2010-08-22 02:41:12

對不起，我錯過了''''''split''之後的'tab-n'。見上面的編輯。 – 2010-08-22 02:45:11

我仍然建議追查根本原因，但這是一個有趣的解決方案。我沒有想到這一點。 – 2010-08-22 03:06:50

我最初的直覺反應是你正在建立你的標籤DIV。我不知道後端語言/平臺，但在ASP.NET中，你可以當你建立你的URL引用做這樣的事情：

~/#tab-1

和~將被解釋爲對解決根目錄。所以，如果你的實際頁面（不是你的路線）是幾個深度級別，那麼~將追加到該HREF的幾個級別。

我並不是說那就是發生了什麼，但是這似乎正在發生。調查您的標籤DIV的製作過程，您如何將href添加到您的<a>標籤中，然後從那裏開始。如果您可以用這些信息更新您的問題，我會相應地更新我的答案。

希望這會有所幫助！

來源

2010-08-21 23:50:50

Jquery選項卡在選項卡中加載當前網址

回答

相關問題