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

Question

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

这是我的问题开始的地方.假设我的选项卡对URL"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 : "tab1.html",
    1 : "tab2.html",
    2 : "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本身的信息.

<div id="tabs">
    <ul>
        <li><a href="tab1.html">tab1</a></li>
        <li><a href="tab2.html">tab2</a></li>
        <li><a href="tab3.html">tab3</a></li>
    </ul>
</div>

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

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

Answer 1

以下将把href写到控制台.

在这里警告ajax tab 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的选项卡的从零开始的索引