jQuery UI Tabs加載錨「這是給出的href

Question

我有奇怪的行爲，我的標籤relkoad頁面＃錨點名稱給出作爲href。不知道爲什麼，因爲我沒有設置通過獲取內容通過ajax。所有的內容都在正常的標記頁面，但thbs從內容域/＃ui-tabs-1

如果我設置了沒有＃的href我在控制檯的get請求中看到一個404錯誤。

jQuery和jQuery UI的都是實際的版本。

有誰實現過這種行爲？

Answer 1

的解決方案得到這與基礎工作的標籤只是把這個在你的JavaScript：

$.fn.__tabs = $.fn.tabs; 
$.fn.tabs = function (a, b, c, d, e, f) { 
    var base = location.href.replace(/#.*$/, ''); 
    $('ul>li>a[href^="#"]', this).each(function() { 
    var href = $(this).attr('href'); 
    $(this).attr('href', base + href); 
}); 
$(this).__tabs(a, b, c, d, e, f); 

};

Answer 2

<div id="c2" class="csc-default"> 
<div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all"> 
    <ul id="tab-menu" class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist"> 

      <li class="ui-state-default ui-corner-top ui-tabs-active ui-state-active" role="tab" tabindex="0" aria-controls="ui-tabs-1" aria-labelledby="ui-id-1" aria-selected="true"> 
       <a href="ui-tabs-1" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-1">Übersicht<span class="squares"></span></a> 
      </li> 


      <li class="ui-state-default ui-corner-top" role="tab" tabindex="-1" aria-controls="ui-tabs-2" aria-labelledby="ui-id-2" aria-selected="false"> 
       <a href="ui-tabs-2" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-2">Features<span class="squares"></span></a> 
      </li> 


      <li class="ui-state-default ui-corner-top" role="tab" tabindex="-1" aria-controls="ui-tabs-3" aria-labelledby="ui-id-3" aria-selected="false"> 
       <a href="ui-tabs-3" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-3">Service<span class="squares"></span></a> 
      </li> 


    </ul> 

     <div id="ui-tabs-1" aria-live="polite" aria-labelledby="ui-id-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" style="" aria-expanded="true" aria-hidden="false"> 
      <section> 
       ... 
      </section> 
     </div> 

     <div id="ui-tabs-2" aria-live="polite" aria-labelledby="ui-id-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" style="" aria-expanded="true" aria-hidden="false"> 
      <section> 
       ... 
      </section> 
     </div> 

     <div id="ui-tabs-3" aria-live="polite" aria-labelledby="ui-id-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" style="" aria-expanded="true" aria-hidden="false"> 
      <section> 
       ... 
      </section> 
     </div> 


</div> 

並且那是JS：

jQuery('#tabs').tabs({ 
show: { effect: "fade", duration: 200 }, 
hide: { effect: "fade", duration: 200 }, 
spinner: false, 
create: function(event, ui) { 
    jQuery('H1').addClass('tab-heading'); 
}, 
beforeActivate: function(event, ui) { 
    $('.layout-2 .column-right').height('auto'); 
    $('.layout-2 .column-right article').height('auto'); 
}, 
activate: function(event, ui) { 
    var heightLeft = $('.layout-2 .column-left').height(); 
    var heightRight = $('.layout-2 .column-right').height(); 
    if (heightRight < heightLeft) { 
    $('.layout-2 .column-right').height(heightLeft); 
    $('.layout-2 .column-right article').height(heightLeft - 80); 
    }; 
} 

}）;

Answer 3

這似乎是在您的標題中設置基本標記的問題。

<base href="..."> 

據一些很老的JQuery的標籤文檔，我發現，如果將標籤鏈接到正常的網址URL，而不是錨，它會加載通過AJAX的標籤內容，如發生在這裏（即使我們實際上有錨）。現在

如果設置了基本路徑，瀏覽器可能會認爲你必須做一個真正的負載與新BAS pasth的錨鏈接衝突......不知道爲什麼瀏覽器認爲。

但是，如果您刪除了基本標籤，則所有按預期工作。

FF中的問題？

在這裏看到： http://forum.jquery.com/topic/problem-with-jquery-ui-tabs-and-base-tag