标签内的jQuery标签未正确显示 [英] jQuery tabs within tabs not showing correctly

问题描述

我为选项卡使用了自定义的javascript代码，效果很好，但是我试图在其中放置子选项卡，如下所示:

I have custom javascript code for tabs which works fine, but Im trying to put children tabs within, shown here:

<div id="tabs" style="position:relative; ">
            <ul id="nav">
              <li><a href="#prizes">Prizes</a></li>
              <li><a href="#basket">Your sack</a></li>
              <li><a href="#order-history">Order History</a></li>
            </ul>

            <div id="tab-prizes" class="tab"> 
              <?php include('prizes.php');?>
            </div>

然后在priests.php文件中:

And then within the prizes.php file:

<div id="tabsprizes" style="position:relative; ">
            <ul id="nav1">
              <li><a href="#branded">Weber Branded</a></li>
              <li><a href="#for-him">For Him</a></li>
            </ul>

            <div id="tab-branded" class="tab">

                <?php echo "fgdsd"; ?>

            </div>

我希望这样做，例如，他们进入奖品"选项卡，并且在其中有另一组选项卡，它们只能在该页面中使用.现在，当单击子选项卡时，所有内容都会消失.这是我的JS:

I would like it so they go to the prizes tab for example, and within that there is another set of tabs, which they can use only within that page. When clicking on the child tabs at the moment, all the content dissapears. Here is my JS:

$("#parenttabs #nav a").click(function() {   //Parent Tabs Click Function
    var hash = this.getAttribute("href");
    if (hash.substring(0, 1) === "#") {
        hash = hash.substring(1);
    }

    location.hash = hash;
    showTab(hash);

    return false;
});

function showTab(hash) {
    $("div.tab").hide();
    $("#tab-" + hash).fadeIn();
}

对不起所有代码，不确定确切显示什么:/

Sorry for all the code, not sure exactly what to show :/

谢谢

推荐答案

看看 JQuery UI选项卡文档，我看不到选项卡功能的引用.当然，假设您正在使用JQuery UI.

Taking a look at the JQuery UI tabs documentation, I see no references to tab-in-tab functionality. Assuming, of course, that you're using JQuery UI.

这是一个示例 JQuery UI嵌套标签的标记.研究一下，您也许可以找出为什么您的代码无法按预期工作的原因.

Here's an example markup of JQuery UI nested tabs. Study it and you might be able to find out why your code doesn't work as intended.

我建议您看看 JQuery工具，因为它确实公开支持标签页功能.

I'd suggest you take a look at JQuery tools, as it does openly support tab-in-tab functionality.

下面是一个示例嵌套的JQuery工具标签标记和脚本.

Here's an example of JQuery tools nested tab markup and script.

这篇关于标签内的jQuery标签未正确显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！