0

我的插件将复制一个节点并将其附加到指定位置。它包括一个删除重复节点的选项。

例子:

$('#duplicateMe').duplicator( {
      copyToLocation:'#copy_to_here', 
      removeButton:'.removeDuplicateBtn'
    });

我正在寻找一种方法来在我的插件中创建一个检查,以确定单击它时 removeButton 的位置并根据它删除一个项目。

我的三个用例将是这样的:

if ( defaultOptions.removeButton is the item duplicated ){ 
         ... is clicked, remove itself 
       }
if ( defaultOptions.removeButton is the child of item duplicated ){ 
         ... is clicked, remove its parent, in turn removing itself 
       }
if ( defaultOptions.removeButton is NOT the item duplicated && is NOT the child of the item duplicated ){ 
         ... is clicked, remove the last item duplicated 
       }      

我可以创建两个单独的 removeButtons。一个删除按钮可能位于重复节点之外,这将删除最后一个重复节点。第二个删除按钮可以在复制节点内部创建,并且可以自行删除。但是,我认为最好声明一个 defaultOptions.removeButton,并且我的代码会检查它在单击时的位置。

removeButton 当前删除最后一个重复的节点,无论哪个具有该类。这意味着无论我单击哪个 removeButton,它都会删除最后一个重复的项目。它可能是重复的,也可能在重复的之外。它删除最后一项。

我一直在为这个逻辑绞尽脑汁。有什么想法可以实现吗?

这是工作中的代码:duplicator.js at work in jsfiddle

如果单击“复制矩形”三次,则可以单击其中任何一个 remove ,它将删除最后一个重复的项目。我希望您能够单击 idPrefix_2 旁边的删除,它只删除 idPrefix_2。或者,如果您单击“删除最后一个矩形”,它将删除剩下的蓝色矩形(队列中的最后一个)。

4

2 回答 2

0

您可以获取单击事件,然后获取被单击的按钮,然后删除其父级确保在

$(defaultOptions.removeButton).click(function(e){

var thisBtn = $(e.currentTarget);
thisBtn.parent(".theBlueSquareClass").remove();

示例:http: //jsfiddle.net/NLfsw/4/

于 2013-09-20T17:54:19.460 回答
0

复制项目时,将类添加duplicated到新元素。

if ($(this).is(".duplicated")) {
    $(this).remove();
} else {
    var dup = $(this).closest(".duplicated");
    if (dup.length) {
        dup.remove();
    } else {
        // remove last duplicated item
    }
}
于 2013-09-20T17:47:19.850 回答