首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >jquery ui选项卡不显示除第一个选项卡之外的任何内容

jquery ui选项卡不显示除第一个选项卡之外的任何内容
EN

Stack Overflow用户
提问于 2020-08-27 13:52:15
回答 2查看 33关注 0票数 0

我有一组选项卡,每个选项卡中都有一个带有几个子div的div。.tabs()调用创建选项卡标题并显示第一个div ...

单击第二个选项卡..."Background“没有显示它,尽管它和第一个标签下的div是一样的…这是可行的。

这是一把js小提琴

https://jsfiddle.net/GeoffRussell/cy6uL41d/

代码语言:javascript
代码运行次数:0
运行
复制
<div id="tabset">
    <ul> 
        <li><a href="#policytab">Policy</a></li>
        <li><a href="#backgroundtab">Background</a></li>
    </ul>
<div id="policytab">
    <div class="panel cflex">
        <div class="textdiv" contenteditable="true">xx</div>
        <div>
            <div class="lrflex">
            <div>L1</div>
            <div class="rflex">
                <div>R1</div>
                <div>R2</div>
            </div>
        </div>
    </div>
</div>
<div id="backgroundtab">
    <div class="panel cflex">
        <div class="textdiv" contenteditable="true">xx</div>
        <div>
            <div class="lrflex">
            <div>L1</div>
            <div class="rflex">
                <div>R1</div>
                <div>R2</div>
            </div>
        </div>
    </div>
</div>
</div>

CSS如下所示

代码语言:javascript
代码运行次数:0
运行
复制
.panel {
    height: 200px;
    border: 1px solid red;
    resize: both;
    overflow: auto;
}
.textdiv {
    border: 1px solid red;
    height: 1500px;
    overflow: auto;
}
.cflex {
    display: flex;
    flex-direction: column;
}
.rflex {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    border: 1px solid purple;
}
.lrflex {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    border: 1px solid green;
}

动作是..。

代码语言:javascript
代码运行次数:0
运行
复制
$("#tabset").tabs();
EN

回答 2

Stack Overflow用户

发布于 2020-08-27 14:32:44

似乎是我在class="lrflex“div之前的额外级别导致了这个问题……但我不知道为什么。

票数 0
EN

Stack Overflow用户

发布于 2020-08-27 17:05:59

我认为你的标签工作的很好,但你的内容文本是相同的,这为什么不显示标签结果。因此,我请求您更改内容,并再次检查。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63609947

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档