不能從jQuery的對話框

我不能jQuery的對話框內的圖像拖放到拖放區域中的圖片...不能從jQuery的對話框

圖像可以拖動，但在新的位置不能砸滴區...

它下降時移回......

我修改了代碼從jQuery的網站，

有人能幫助我....

我真的不知道如何解決這個bug ...

<HTML> 
    <head> 
     <link rel="stylesheet" type="text/css" href="jquery-ui-1.8.24.custom.css" /> 
     <script type="text/javascript" src="jquery-1.8.2.min.js"></script> 
     <script type="text/javascript" src="jquery-ui-1.8.24.custom.min.js"></script> 
     <script type="text/javascript" src="jquery.easydrag.js"></script> 
     <style> 
      #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 0px;} 
     </style> 
     <script> 
      var draggableArguments={ 
       scope: "items", 
       cursor: 'hand', 
       revert:'invalid', 
       helper:'clone', 
       appendTo: '#droppable', 
       scroll: false, 
       containment: 'DOM', 
       zIndex: 1500, 
       addClasses: false, 
      } 
      $(function() { 
       $("#dialog").dialog({title: 'Some title', width:300, eight:600}); 
       $("#drag").draggable(draggableArguments); 
       $("#droppable").droppable() 
      }); 
     </script> 
    </head> 
    <body> 
     <div class="demo"> 
      <div id="dialog" title="Basic dialog"> 
       <div id="drag"> 
        <img src="low.gif"/> 
       </div> 
      </div> 
      <div id="droppable" class="ui-widget-header"> 
       <p>Drop here</p> 
      </div> 
     </div><!-- End demo --> 
    </body> 
</HTML>

來源

2012-10-04 aquatear

惠，您需要指定當你放下的元素會發生什麼：如果要插入您的可拖動到可放開，你需要寫這個動作。

從jQuery-UI DOC源：

  drop: function(event, ui) { 
      $(this).find(".placeholder").remove(); 
      $("<li></li>").text(ui.draggable.text()).appendTo(this); 
     }

當下降，它們在與所述拖動元素的文本的列表添加元素。

來源

2012-10-04 13:19:16

我糾正你的代碼：

<HTML> 
<head> 
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.8.24/themes/base/jquery-ui.css" /> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.24/jquery-ui.min.js"></script> 
<script> 
var draggableArguments={ 
    cursor: 'hand', 
    appendTo: '#droppable', 
    scroll: false, 
    containment: 'DOM', 
    zIndex: 1500, 
    addClasses: false 
} 
$(function() { 
    $("#drag").draggable(draggableArguments); 
    $("#droppable").droppable({ 
     drop: function(event, ui) { 
      $(ui.draggable).remove(); 
      $(ui.draggable.html()).appendTo(this); 
     } 
    }); 
}); 
</script> 
</head> 
<body> 
<div id="dialog" title="Basic dialog"> 
<div id="drag"> 
    <img src="low.gif"/> 
</div> 
</div> 
<div id="droppable" class="ui-widget-header"> 
    <p>Drop here</p> 
</div> 
</body> 
</HTML>

來源

2012-10-04 13:41:23 Koerr

不能從jQuery的對話框

回答

相關問題