0

我已经实现了 jquery-ui 默认选项卡，我的客户已经回复我，要求在最初登陆页面时存在与选项卡本身分开的主页消息。所以为了说明......我有五个标签，其中有五个对应的 div 和相关的内容。需要添加另一个将在初始化时显示的内容 div，然后一旦选择了一个选项卡，它就会消失并且无法访问。li 元素都需要一个相应的 div 才能使用，如果我尝试将额外的 li 设置为 display:none，jquery 初始化会将其删除......是否有一个简单的解决方案，或者我将不得不编写自定义代码这？

 $(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..
4

1 回答 1

0

好的，

如前所述，使用删除：

$('#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 来处理隐藏它（当我这样做时，我使用了向下滑动），你就准备好了。

于 2012-09-28T17:48:48.550 回答