UPDATE:
http://jsfiddle.net/wJUHF/7/ http://jsfiddle.net/wJUHF/7/
对于任何可能阅读本文的人来说，这是更新且有效的小提琴。
我正在努力让这个小提琴发挥作用。
这就是问题所在。我可以将图像拖到容器中。它附加一个克隆，没有问题。当我单击将克隆图像拖动到容器中时，它第一次可以正常工作。第二次单击拖动时，它不拖动，而是克隆已经克隆的图像。为了更好地理解，我创建了一个 jsfiddle。请看一下并让我知道我哪里出错了。
http://jsfiddle.net/wJUHF/ http://jsfiddle.net/wJUHF/
Thanks
CODE:
$(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;
}
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"
});
解决了您的问题 JSFIDDLE 演示 http://jsfiddle.net/vaibviad/njYqA/214/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
