Question

我正在制作一个实验性网页设计应用，今天遇到了一个问题。我正在尝试复制我选择的元素（通过添加/删除#stylethis id attr）

var MoveSelectedElement = function() {
    $('.drawing-area').children().drag("start",function( ev, dd ){
        dd.attrc = $( ev.target ).prop("className");
        dd.attrd = $( ev.target ).prop("id");
        dd.width = $( this ).width();
        dd.height = $( this ).height();
    })
    .drag(function( ev, dd ){
        var props = {};
        if ( dd.attrc.indexOf("E") > -1 ){
            props.width = Math.max( 32, dd.width + dd.deltaX );
        }
        if ( dd.attrc.indexOf("S") > -1 ){
            props.height = Math.max( 32, dd.height + dd.deltaY );
        }
        if ( dd.attrc.indexOf("W") > -1 ){
            props.width = Math.max( 32, dd.width - dd.deltaX );
            props.left = dd.originalX + dd.width - props.width;
        }
        if ( dd.attrc.indexOf("N") > -1 ){
            props.height = Math.max( 32, dd.height - dd.deltaY );
            props.top = dd.originalY + dd.height - props.height;
        }
        if ( dd.attrd.indexOf("stylethis") > -1 ){
            props.top = dd.offsetY;
            props.left = dd.offsetX;
        }
        $('#stylethis').css( props );
    }, {relative:true});

    $('.drawing-area *').on('mousedown touchstart', function() {
        if(moveable) {
            // Add stylethis class
            $('div.handle').remove();
            $('.drawing-area, .drawing-area *').removeAttr('id');
            $(this).attr('id', 'stylethis').append('<div class="handle NE"></div><div class="handle NN"></div><div class="handle NW"></div><div class="handle WW"></div><div class="handle EE"></div><div class="handle SW"></div><div class="handle SS"></div><div class="handle SE"></div>');
        }
    });
};

这就是我复制元素的方式。

$(".duplicate").on('click touchend', function() {
    $('.drawing-area').append($("#stylethis").parent().html());
    $('.drawing-area, .drawing-area *').removeAttr('id');
    $('div.handle').remove();
    MoveSelectedElement();
});

我遇到的问题是我第二次复制所选元素后（在已经添加了两个元素之后）而不是添加1它会添加另外两个，依此类推2.我只想复制所选元素由1（因此“复制”一词）。我不确定为什么它的行为方式如此。

如果有人能帮助我解决这个问题，我们将不胜感激。

Answer 1

而不是使用

$('.drawing-area').append($("#stylethis").parent().html());

在复制元素的代码中，使用

$('.drawing-area').append($("#stylethis").clone());

您的代码确实复制了整个.drawing-area内容，其中包含所有选择 div。

小提琴 http://jsfiddle.net/zRDgK/1/

复制元素+ 1 NOT x 2

1 个答案: