Question

我的页面上的某些div上有以下标签:(此代码是根据预定义的条件动态生成的，因此内容永远不会相同，我所知道的唯一一件事就是总会有 tabsContainerDiv 初始化控件）

<div id="parentContainer">
    <div id="tabsContainerDiv">
        <ul>
            <li><a href="#page1">Pag. 1-</a></li>
            <li><a href="#page2">Pag. 2-</a></li>
        </ul>

        <div id="page1" name="page1">
            <span style="left:120px; top:4px" class="Label" id="Pg1Cap1">TITLE</span>
            <span style="left:1056px; top:4px" class="Label" id="Pg1Cap2"></span>
            <span style="left:216px; top:28px" class="Label" id="Pg1Cap3">OTHER CONTENT</span>
            <span style="left:1056px; top:28px" class="Label" id="Pg1Cap4"></span>
        </div>
        <div id="page2" name="page2">
            <input type="text" readonly="readonly" maxlength="10" size="10" class="Field" id="object_identifier" />
        </div>

    </div>
</div>

然后，我初始化UI，它完美无缺：

$('#tabsContainerDiv').tabs();

现在，我需要将这些TABS复制到Dialog控件上的div中，我已经有了另一个div，所以我这样做：

$('#htmlEditor').html($('#parentContainer').html());

这也有效，就像它复制Tabs内容一样（也包括jquery UI添加的类，使其看起来像TAB结构），问题是我希望我可以复制TABS包括行为，我的意思是，无需重新创建标签 $('#tabsContainerDiv').tabs();，

有办法做到这一点吗？也许使用.live()或者其他说法：每当我们检测到id为tabsContainerDiv的元素时，请附加.tabs()事件。

任何帮助或建议将不胜感激。感谢。

Answer 1

尝试使用clone()。它有一个参数来指定在克隆元素时是否应该包含事件。

var tabs = $('#parentContainer #tabsContainerDiv').clone(true);
$('#htmlEditor').append(tabs);

根据插件的不同，这可能会导致将两组标签视为一个问题。你现在的方法可能还是最好的。

复制Jquery UI选项卡，包括行为

1 个答案: