Question

我使用CloneYa plugin克隆表单的一部分。克隆的部分包含jQuery UI Tabs块。

我遇到的问题是我无法初始化克隆标签的功能，而是在点击它们时切换原始标签栏中的内容。

$('#formclone').cloneya({
        limit       : 20,
        cloneThis       : '.formPack',
        valueClone      : false,
        dataClone       : false,
        deepClone       : false,
        cloneButton     : '.clone',
        deleteButton    : '.delete',
        clonePosition   : 'after',
        serializeID         : true
    }).on('clone_after_append', function(event, toclone, newclone) {
        $(toclone).children('.tab-container').hide();
        $(toclone).children('.preview').show().effect('highlight', {}, 1000);
        var idNum = $(newclone).children('.preview').attr('id').replace(/preview/, '');
        $('#tab-container' + idNum).tabs();
});

我尝试用这些线做的事情：

var idNum = $(newclone).children('.preview').attr('id').replace(/preview/, '');
$('#tab-container' + idNum).tabs();

是获取新克隆的.preview div的id（例如＃preview1），删除预览部分，这样就获得了克隆的id。

然后我想用这个容器id运行tab函数。

虽然没有让它发挥作用。

我是否应该采用另一种方式，或者我可以通过其他方式获取ID并运行该功能？

修改：以下是表单示例：

<div id="formclone">
<div id="formPack" class="formPack">
<div id="preview" class="preview">
Test
</div>

<div id="tab-container" class="tab-container">
<ul class="etabs">
<li class="text"><a href="#text" class="textTab" title="Lägg till text"><i><span>Lägg till text</span></i></a></li>
<li class="bild"><a href="#bild" class="bildTab" title="Ladda upp bild"><i><span>Ladda upp bild</span></i></a></li>
<li class="video"><a href="#video" class="videoTab" title="Infoga video"><i><span>Infoga video</span></i></a></li>
</ul>

<div id="text" class="text-container">
Test
</div>

<div id="bild" class="bild-container">
Test
<a href="#" class="clone">clone</a>
<a href="#" class="delete">delete</a>
</div>

<div id="video" class="video-container">
Test
</div>

</div>
</div>
</div>

我还将此功能添加到CloneYa插件中，以更新到标签的href：

var href = $(this).attr('href');
                if (href) {
                    // match the id with the regex to get the string part
                    // separate from the number part 
                    var match = href.match(regex);

                    // if there was a number
                    if (match && match.length === 3) {
                        // just take the string part
                        // add the new number to it
                        $(this).attr('href', match[1] + j);
                    } else {
                        // else there was no number,
                        // this was earlier the first element
                        // just add the number to its id
                        $(this).attr('href', href + j);
                    }
                }

...这里是文件就绪功能：

jQuery(document).ready(function($){
$('.preview').hide();
$('#tab-container').tabs();
});

谢谢！ // Jens。

Answer 1

你试过了吗？

jQuery(document).ready(function($){
    $('.preview').hide();
    $('.tab-container').tabs();
});

和

$('#formclone').cloneya({

    // .... options

}).on('clone_after_append', function(event, toclone, newclone) {

    // .... other stuff

    $(newclone).find('.tab-container').tabs();

});

使用CloneYa插件克隆后无法重新初始化jQuery UI选项卡

1 个答案: