带有非选定默认选项卡的Jquery选项卡

Question

我已经实现了jquery默认选项卡，我的客户端返回给我，请求在最初登陆页面时，存在一条主页消息，该消息与选项卡本身是独立的。为了说明.我有五个标签，五个对应的div和相关的内容。需要添加另一个div的内容，将显示在初始化，然后一旦选择一个选项卡，它将消失，无法访问。li元素都需要一个相应的div来处理，如果我尝试设置额外的li以显示:none，jquery初始化会在那里删除it...is --这是一个简单的解决方案，还是必须为此编写自定义代码？

 $(document).ready(function () {
            $(".tabs").tabs({ event: "mouseover", fx: { opacity: 'toggle', duration: 'fast' }
            });
        });

添加了

 $(document).ready(function(){
        $("#blank").remove();});

html

    <div class="tabs">
<ul>
      <li id="blank" class="tabsm"><a href="#keytab-x" style="display: none"></a></li>
      <li class="tabsm"><a href="#keytab-1"tab1</a></li>
      <li class="tabsm"><a href="#keytab-2">tab2t</a></li>
      <li class="tabsm"><a href="#keytab-3">tab3</a></li>
      <li class="tabsm"><a href="#keytab-4">tab4</a></li>
      <li class="tabsm"><a href="#keytab-5">tab5</a></li>
</ul>}
 <div id="keytab-x">
                    <h2>
                        this is the default</h2>
                    <p>
                        </p>
                </div>
    <div id="keytab-1">
                    <h2>
                        this is tab 1</h2>
                    <p>
                        </p>
                </div>
    <div id="keytab-2">
                    <h2>
                        this is the tab 2</h2>
                    <p>
                        </p>
                </div>
    <div id="keytab-3">
                    <h2>
                        this is the tab 3</h2>
                    <p>
                        </p>
                </div>
</div>
etc..

Answer 1

好的,

如前所述，请使用删除：

$('#tabs').tabs('remove', 2);

或者在标签上放置一个层，在x时间之后或与选项卡交互时，该层被移除/隐藏在DOM中。

我做了一次这样的广告块，将覆盖标签。

你可以把你的结构像：

<div id="tabs">
    <ul>
        <li>
            <a href='#tabs1">tab 1</a>
        </li>
         <li>
            <a href='#tabs2">tab 2</a>
        </li>
    </ul>
    <div id="tabs1"> my tab1 content</div>
    <div id="tabs2"> my tab2 content </div>
    <div id="myOverlay"> my overlay content </div>
</div> <!-- end tabs -->

根据jQuery UI选项卡的工作原理，只有具有与ul中哈希匹配的id的div才会被视为“选项卡”的一部分--任何其他div呈现为正常的div。因此，使用一些css绝对定位覆盖，一些jquery处理隐藏它(当我这样做时，我使用了一个向下滑动)，您将全部设置好了。