0

我正在通过“选项卡添加”按钮创建一个动态选项卡。

“选项卡添加”按钮附加到选项卡的末尾，然后初始化选项卡，例如

$('#tabs').sortable({
    create: function( event, ui ) {
        $tabs = $( '#tabtab' ).tabs({
            create: function(event, ui) {
                $('#tabs').append( '<li id="tab-add" class="noSort"></li>' );
            },
            add: function( event, ui ) { ...

在此处输入图像描述

当单击“tab-add”按钮（实际上是一个 li ）时，会使用 .tabs( 'add', href, input ) 表示法创建一个新选项卡。然后我将一个输入字段注入到这个生成的选项卡 li 中。这将删除新创建的 li 中默认生成的链接。

在此处输入图像描述

<li id="tab-1">
    <input type="text" id="tab-input"></input>
</li>

在此处输入图像描述

当输入失去焦点时，这可以正常工作，将输入中收集的信息发布到数据库，并将正确的 li 语法返回到 id "tab-1"。

<li id="tab-1">
    <a href="#tabs-1">The Name of My New Tab</a>
</li>

现在，这就是我卡住的地方。

选择了正确的选项卡（如上所示）并显示面板，但是当我单击另一个已创建的选项卡然后单击我刚刚生成的选项卡时，该选项卡将不会选择（见下文）。当我尝试单击“我的新标签的名称”选项卡时，它没有选择（突出显示）。

在此处输入图像描述

这与“tab-1”的内容是动态生成的并且选项卡本身没有重新生成的事实有关。因为，如果我继续添加另一个新选项卡，则该选项卡开始正常工作。我不想进行页面刷新，我只是希望该选项卡在生成后立即工作。我试过选择、加载和启用选项卡，但没有任何效果。

在这种动态方法之后，是否有一种巧妙的方法来重新生成选项卡？

我希望这次阅读不会太沉闷！任何帮助将非常感激。

4

1 回答 1

2

好的，我现在明白了。问题是当您添加一个新选项卡时，jquery.ui 代码会将一堆处理程序附加到您要替换的那个标记上。不要替换此标签，只需将其隐藏即可。然后当输入失去焦点时，更改 jquery.ui 创建的文本中的文本并再次显示。这样，您就可以保留 jquery.ui 附加的所有处理程序。

于 2011-05-04T01:03:42.407 回答