我有jQuery選項卡,其中的內容在單擊選項卡時被延遲加載。這很好。將jQuery選項卡ID從#ui-tabs重命名爲其他東西
<div id='tabs'>
<ul>
<li><a href='url-to-content'><span>John</span></a></li>
<li><a href='url-to-content'><span>Arnold</span></a></li>
<li><a href='url-to-content'><span>Dilbert</span></a></li>
</ul>
</div>
我想直接鏈接到特定的選項卡,以便該特定的選項卡打開該鏈接。這是由
http://www.example.com/tab_page#ui-tabs-2
例如實現我想有「用戶界面的選項卡-2」有意義的事情,比如在這種情況下更換
http://www.example.com/tab_page#dilbert
所以基本上我想能夠將jQuery默認的'ui-tabs-1','ui-tabs-2'等標籤ID重命名爲其他內容。
當內容不是延遲加載時很容易,因爲我自己創建了選項卡DIV和ID。但延遲加載的DIV創建由jQuery照顧,我無法找到一種方式來影響它。
我試圖把錨的URL像這樣
<li><a href='url-to-content#dilbert'><span>Dilbert</span></a></li>
不要太大的驚喜,也沒有工作。
我知道散列#後的DIV ID對接受什麼字符有限制,但這不是問題。該部分與標籤可見名稱不完全相同,但只是關閉。
這是我的第一個問題,我已經研究了幾個小時的問題,但沒有運氣。如果之前已經討論過這個問題,我表示歉意,如果有的話,請提供一個關於這個問題的鏈接。我無法找到之前討論過的這個問題。
使用jQuery v1.11.1和jQuery UI - v1.10.4(均爲最新版本)。
更新:
基於blgt的想法,我寫了同樣的概念,但略有不同的實施工作方案。在現實生活中的選項卡的數量是不一樣的每一次,所以我結束了動態創建一個JavaScript對象,然後使用該選擇的標籤,就像這樣:
var tabs = {
'#john' : 0,
'#arnold' : 1,
'#dilbert' : 2
// There are more tabs
}
if(window.location.hash in tabs) {
$('#tabs').tabs('option', 'active', tabs[window.location.hash]);
}
所以,沒有jQuery的UI的深入瞭解,我想,整個部件將不會盡快工作,因爲標籤有不同的id的權利? 在這種情況下,我會爲我的選項卡插入「data-」屬性,在其中插入我的導航鏈接的文本。那麼你可以使用ui-tabs的url()函數將url設置爲你的data屬性,並且不會干擾jquery-ui選擇器... – errand 2014-08-28 10:48:53