2013-05-06 64 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/