从jQuery-UI选项卡获取目标URL

我正在开发一个大量使用jQuery选项卡和Ajax的项目。 将数据加载到选项卡本身就很简单，但选项卡中的数据需要通过位于选项卡div之外的选择框进行过滤。

这是我的问题开始的地方。 假设我的选项卡对URL“https://stackoverflow.com/questions/1359343/getting-target-url-from-jquery-ui-tabs/tab1.html”进行Ajax调用。 jQuery选项卡将此目标更改为类似“＃ui-tabs-10”的哈希值，但我可以通过以下代码获取原始URL：

$("#tabs").tabs({ select: function(event,ui) { var url = $.data(ui.tab, 'load.tabs'); ...do stuff with url } }); 

但我似乎无法访问此事件调用之外的ui.tab对象。 所以我的选择框更改事件最终看起来像这样：

 var urls = { 0 : "https://stackoverflow.com/questions/1359343/getting-target-url-from-jquery-ui-tabs/tab1.html", 1 : "https://stackoverflow.com/questions/1359343/getting-target-url-from-jquery-ui-tabs/tab2.html", 2 : "https://stackoverflow.com/questions/1359343/getting-target-url-from-jquery-ui-tabs/tab3.html" } $('#selectBox').change(function(){ var tabs = $("#tabs").tabs(); var id = $('#selectBox').attr("selectedIndex"); var selectedTab = tabs("option", "selected"); var newUrl = urls[selectedTab] + "?id=" + id; tabs("url", selectedTab, newUrl); tabs("load", selectedTab); }); 

我的问题是哈希映射。 我不需要它，它复制了我已经编码到选项卡div本身的信息。

 
 
 
tab1
 
tab2
 
tab3
 
  

我已经用尽了Firebug中的文档和DOM树都无济于事。 关于如何从tab事件外部检索href的任何想法？

我正在使用jQuery UI 1.7.2版。 Muchos gracias提前。 你们是最棒的。

Answer 1

以下将把href写到控制台。

在这里警告ajax选项卡href的演示

 $('#tabs a').each(function() { var href = $.data(this, 'href.tabs'); console.log(href); }) 

Answer 2

 var links = $("#thetabs > ul").find("li a"); var url = $.data(links[tabnum], 'href.tabs'); 

tabnum是您想要url的选项卡的从零开始的索引

Answer 3

您还可以在选项卡链接中设置title属性。

 
 
 
tab1
 
tab2
 
tab3
 
  

有了这个，JQueryUI将创建具有基于标题的id的div，并用下划线替换空格，因此您应该能够使用类似的东西访问div

 $("#First_tab_contents") 

干杯!