2013-05-06 72 views
4

我想要放在一个div中的图像,以创建图像克隆里面的那个div的编号是cesta,但我只得到禁止符号。jquery draggable不允许拖动克隆图像

HTML

<div id='productos' > 
    <h3>PRODUCTOS</h3> 
    <img id='ali-12' name='serv' class='productos' src='img/objects_139.jpg' /> 
    <img id='mon-23' name='serv' class='productos' src='img/objects_132.jpg' /> 
    <img id='zap-32' name='serv' class='productos' src='img/objects_135.jpg' /> 
    <img id='gua-21' name='serv' class='productos' src='img/objects_102.jpg' /> 
    <img id='rod-11' name='serv' class='productos' src='img/objects_136.jpg' /> 
    <img id='maz-44' name='serv' class='productos' src='img/objects_137.jpg' /> 
    <img id='lla-97' name='serv' class='productos' src='img/objects_138.jpg' /> 
    <img id='par-10' name='serv' class='productos' src='img/objects_126.jpg' /> 
    <img id='cru-24' name='serv' class='productos' src='img/objects_121.jpg' /> 
    <img id='gaf-15' name='serv' class='productos' src='img/objects_131.jpg' /> 
</div> 
<div id='cesta'> 
</div> 

JAVASCRIPT

$(document).ready(function(){ 
    $(".productos").draggable({helper:'clone'}); 
    $("#cesta").droppable({ 
     accept: ".productos", 
     drop: function(event,ui){ 
       $(this).append($(ui.draggable).clone()); 
     } 
    }); 
}); 
+3

您使用的是什么浏览器?作品在这里:http://jsfiddle.net/gaVb7/ – 2013-05-06 18:36:49

+0

@roasted Firefox的最后一个版本 – jal 2013-05-06 18:38:46

+0

这适用于我在Firefox下v20.0.1:http://jsfiddle.net/Cz649/ – 2013-05-06 18:45:57

回答

0

你的代码似乎工作的罚款。我尝试了这个,并且工作得很完美。

我所做的一切比你贴什么其他的是:

1)增加了2个库

2)增加了一些CSS

JS代码是一样的你。

<script src="libs/jquery.js"></script> 
<script src="libs/jquery_ui.js"></script> 

<div id='productos' > 
    <h3>PRODUCTOS</h3> 
    <img id='ali-12' name='serv' class='productos' src='n-2.png' /> 
    <img id='mon-23' name='serv' class='productos' src='n-3.png' /> 
    <img id='zap-32' name='serv' class='productos' src='n-4.png' /> 
    <img id='gua-21' name='serv' class='productos' src='n-5.png' /> 
    <img id='rod-11' name='serv' class='productos' src='n-6.png' /> 
    <img id='maz-44' name='serv' class='productos' src='n-7.png' /> 
</div> 
<div id='cesta'> 
<script> 
$(document).ready(function(){ 
$(".productos").draggable({helper:'clone'}); 
$("#cesta").droppable({ 
    accept: ".productos", 
    drop: function(event,ui){ 
      $(this).append($(ui.draggable).clone()); 
    } 
    }); 
}); 
</script> 

http://jsfiddle.net/janakshah89/sSRXk/1/