从jQuery-UI选项卡获取目标URL [英] Getting Target URL from jQuery-UI Tabs

问题描述

我正在研究一个大量使用jQuery选项卡和Ajax的项目.将数据加载到选项卡本身很简单，但是选项卡中的数据需要由位于选项卡div外部的选择框进行过滤.

I'm working on a project that makes heavy use of jQuery tabs and Ajax. Loading data into the tabs is simplicity itself, but the data in the tabs needs to be filtered by a select box that sits outside the tabs div.

这是我的问题开始的地方.假设我的标签页对URL"tab1.html"进行了Ajax调用. jQuery选项卡将此目标更改为哈希值，类似于#ui-tabs-10"，但我可以通过以下代码获取原始URL:

Here's where my problem starts. Let's say my tab makes an Ajax call to the URL "tab1.html." jQuery tabs changes this target into a hash value something like "#ui-tabs-10," but I can get the original URL through the following code:

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

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

But I cannot seem to access the ui.tab object outside this event call. So my select box change event ends up looking like this:

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本身中的信息.

My problem is that hash map. I don't need it, and it duplicates info that I've already coded into the tabs div itself.

<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的任何想法?

I've exhausted both the docs and the DOM tree in Firebug to no avail. Any ideas on how I can retrieve the href from outside a tab event?

我正在使用jQuery UI版本1.7.2.预先提供了Muchos gracias.你们是最棒的.

I'm using jQuery UI version 1.7.2. Muchos gracias in advance. You guys are the best.

推荐答案

以下内容会将href写入控制台.

The following will write out the href's to the console.

提醒ajax选项卡的演示href位于此处

Demo that alerts the ajax tab href's here

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

这篇关于从jQuery-UI选项卡获取目标URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！