jQuery draggable / droppable问题

Question

I can drag items without any problem unfortunately items can be dragged everywhere which I do not want. 我可以毫无问题地拖动物品，不幸的是，物品可以被拖到任何我不想要的地方。 I only want items to be dragged on some specific areas such as buttonmenu. 我只希望在某些特定区域（例如buttonmenu）上拖动项目。 I used many methods but I have not got any result. 我使用了很多方法，但我没有得到任何结果。 Could you please tell me how to disable a buttonmenu which has id of 34 not to drop buttons there? 你能告诉我如何禁用id为34的按钮菜单，不要在那里删除按钮吗？ You can see the code that I am using (which does not work for not droppping) 你可以看到我正在使用的代码（这不适用于不删除）

Best Regards 最好的祝福

Altaico Altaico

Here is the code: 这是代码：

$("#35").draggable();
$("myArticle").droppable( "option", "disabled", true );

Answer 1

You want to set the revert: invalid option on the draggable object which will caused it to snap back if it is dropped onto anything not marked as droppable, so try: 您希望在可拖动对象上设置revert：invalid选项，如果将其拖放到未标记为droppable的任何内容上，则会导致它快速恢复，因此请尝试：

$("#35").draggable({revert: "invalid"}));
$("myArticle").droppable( "option", "disabled", true );
$("#36").droppable( "option", "disabled", false );

This means you'd be able to drag 35 onto 36 but not onto myarticle. 这意味着你可以将35拖到36而不是在myarticle上。

Below is the full page html: 以下是整页html：

<head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script>
</head>    
<body>
  <script type="text/javascript">
    $().ready(function() {
      $("#35").draggable({revert: "invalid"});
      $("#36").droppable({disabled: false });
    });
  </script>
  <div id="34" style="width:100px; height:100px; background-color:red;"> 
    </div>
  <div id="35" style="width:100px; height:100px; background-color:yellow;" >
     </div>
  <div id="36" style="width:300px; height:300px; border:solid blue 1px;">
    drop me here
  </div>
</body>

This renders 2 coloured blocks (the divs). 这将呈现2个彩色块（div）。 You can drag the yellow one (id 35) and drop it only in the square labelled "drop me here". 你可以拖动黄色的一个（id 35）并将其放在标有“drop me here”的方格中。 If you wanted to drop it anywhere else, you'd have to decorate that area with droppable 如果你想把它放在其他任何地方，你必须用droppable装饰那个区域

Hope this helps 希望这可以帮助

Answer 2

看看你的droppable元素的accept选项 - 这允许你指定被拖动的元素在被考虑用于drop oeration之前必须具有哪些类，或者你可以用来根据其他一些来做出这个决定的函数标准。

jQuery draggable / droppable问题

问题描述

2 个解决方案

解决方案1
2 2010-08-19 14:15:31

解决方案2
0 2010-08-19 13:58:41

jQuery draggable / droppable问题

问题描述

2 个解决方案

解决方案1 2 2010-08-19 14:15:31

解决方案2 0 2010-08-19 13:58:41

解决方案1
2 2010-08-19 14:15:31

解决方案2
0 2010-08-19 13:58:41