jQuery draggable / droppable problem
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. I used many methods but I have not got an开发者_StackOverflowy result. Could you please tell me how to disable a buttonmenu which has id of 34 not to drop buttons there? You can see the code that I am using (which does not work for not droppping)
Best Regards
Altaico
Here is the code:
$("#35").draggable();
$("myArticle").droppable( "option", "disabled", true );
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:
$("#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.
Below is the full page 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). You can drag the yellow one (id 35) and drop it only in the square labelled "drop me here". If you wanted to drop it anywhere else, you'd have to decorate that area with droppable
Hope this helps
Have a look at the accept
option for your droppable element - this allows you to either specify which classes the dragged element must have before it will be consider for a drop oeration, or a function which you can use to make this decision based on some other criteria.
精彩评论