2

I'm having a big headache here...

I'm working on updating an old website using jQuery 1.3 to jQuery 1.10. And now, I'm struggling since 2 days now about how to change a tab's URL dynamically in order to reload it with a new content into the same tab.

I clarify a bit. Let's say I have a single tab. When I click on this tab, I want "page1.php" to be shown there. Here no prob ! My page1.php content is well displayed. inside it, I have a link "go to next page" which should display the next page (page2.php) inside my tab. When I click on this link, I'd like to tell my tab to change its href attribute and reload itself with the new content.

I saw on the official doc that "url" and "title" are deprecated, and that we should use "aria-controls" instead.

I tried a lot to deal with it, but still can't find any solution around it.

here's what the old website used to do:

$("#tabs").tabs("url", "1", "page2.php");
$("#tabs").tabs('load', 1);

here's the first piece of code I tried:

$("#tabs").attr('aria-controls', "page2.php");
$("#tabs").tabs('load', 1);

I even tried to refresh but still didn't work:

$("#tabs").attr('aria-controls', "page2.php");
$("#tabs").tabs('refresh');

Thanks in advance for your help.

4

2 回答 2

0

最后，第三个对我的大脑更好。这是一个解决方案：

function loadURLinTab(tabsWidget, url)
{
    var active = tabsWidget.tabs( "option", "active" );

    tabsWidget.find("ul>li a").eq(active).attr('href', url);
    tabsWidget.tabs('load', active);
}

传递 jQuery 对象（Tabs 小部件的）和您要在选项卡中加载的 URL，然后就可以了！

于 2013-06-15T12:14:18.863 回答
0

这是另一种如何通过点击更改 url 的方法，使用 jquery-ui api 方法。

首先设置标签

$("#tabs").tabs({
    beforeActivate: function(event, ui) {
        ui.newTab.context.href = $("#linkID").attr('href');
    }
});

然后在链接上单击激活选项卡，这会将选项卡 href 更新为链接 href。

$("#linkID").on('click', function() {
    $("tabs").tabs('option','active',1);
});

希望这可以帮助某人。

于 2013-11-01T10:50:16.370 回答