Jquery kéo(), clone() để thêm div ... Pls Fiddle jsfiddle tôi

UPDATE:Jquery kéo(), clone() để thêm div ... Pls Fiddle jsfiddle tôi

http://jsfiddle.net/wJUHF/7/
Đây là cập nhật và fiddle làm việc cho bất cứ ai có thể đọc.

Tôi đang cố gắng giải quyết vấn đề này.

đây là nơi xảy ra sự cố. Tôi có thể kéo hình ảnh vào vùng chứa. Nó gắn một bản sao, không có vấn đề gì. Khi tôi nhấp để kéo hình ảnh nhân bản trong vùng chứa, nó hoạt động đúng vào lần đầu tiên. Lần thứ hai tôi nhấp để kéo, nó không kéo nhưng nhân bản hình ảnh đã được nhân bản. Để hiểu rõ hơn, tôi đã tạo ra một jsfiddle. xin vui lòng có một cái nhìn và cho tôi biết nơi tôi đang đi sai ở đây.

http://jsfiddle.net/wJUHF/

Cảm ơn

Mã sản phẩm:

$(function(){ 
    //Make every clone image unique. 
    var counts = [0]; 
    $(".dragImg").draggable({ 
     helper: "clone", 
     //Create counter 
     start: function() { counts[0]++; } 
    }); 

    $("#dropHere").droppable({ 
     drop: function(e, ui){ 
      $(this).append($(ui.helper).clone()); 
      //Pointing to the dragImg class in dropHere and add new class. 
      $("#dropHere .dragImg").addClass("item-"+counts[0]); 
      //Remove the current class (ui-draggable and dragImg) 
      $("#dropHere .item-"+counts[0]).removeClass("dragImg ui-draggable ui-draggable-dragging"); 
      //not working 100%   
      $(".item-"+counts[0]).dblclick(function(){ 
       $(this).remove(); 
      });  

      //make the div draggable --- Not working???  
      make_draggable($(".item-1"));    
     } 
    }); 

    var zIndex = 0; 
    function make_draggable(elements) 
    { 
     elements.draggable({ 
      containment:'parent', 
      start:function(e,ui){ ui.helper.css('z-index',++zIndex); }, 
      stop:function(e,ui){} 
     }); 
    } 
});

HTML:

<body> 
    <div class="dragImg"><img src="http://placehold.it/80x80"> 
    </div> 
    <div id="dropHere"></div> 
</body>

CSS:

#dropHere { 
    width:400px; 
    height: 400px; 
    border: dotted 1px black; 
}

.210

Nguồn

2013-08-28 n00bInNeed

Cảm ơn bạn tiết kiệm ngày của tôi. –

Bạn chỉ cần một điều kiện để phân biệt trong xử lý thả:

if(ui.draggable.hasClass("dragImg")) 
    $(this).append($(ui.helper).clone());

Nguồn

2013-08-28 20:15:03

Đã làm việc, cảm ơn sự giúp đỡ :) Ill thêm jsfiddle đã cập nhật khi tôi đã hoàn tất. – n00bInNeed

jQuery(".dragImg").draggable({ 
     // use a helper-clone that is append to 'body' so is not 'contained' by a pane 
     helper: function() { 
      return jQuery(this).clone().appendTo('body').css({ 
       'zIndex': 5 
      }); 
     }, 
     cursor: 'move', 
     containment: "document" 
    });

SOLVED UR PROBLEM JSFIDDLE DEMO

Nguồn

2013-08-28 20:42:12

Cảm ơn sự giúp đỡ và nỗ lực. – n00bInNeed

Jquery kéo(), clone() để thêm div ... Pls Fiddle jsfiddle tôi

Trả lời

Các vấn đề liên quan