2

请查看这个jsFIDDLE

<div id="wrapper">
    <div class="item">
        <div class="button_area"></div>
        <div class="icon"></div>
    </div>

    <div class="item">
        <div class="button_area"></div>
        <div class="icon"></div>    
    </div>
</div>​

这是html代码,我正在拖动.button_area:

$('.button_area').draggable({});

除了一件事之外,它的工作方式与它所认为的一样。当我单击红色区域(在第二个黄色方块中)并开始向左拖动(第一个黄色方块)时,我希望它在鼠标经过第二个黄色方块(父级)时停止拖动过程....不是可拖动的对象(助手)...鼠标。

4

2 回答 2

3

您只能以这种方式修改您的 jquery

$( ".button_area" ).draggable({
drag: function(event, ui) { 
  if(my_condition) 
      return false; }
  });​

提示!

一个例子是这样的:

$( ".button_area" ).draggable({
drag: function(event, ui) { 
  if($('.button_area').offset().left > 50) 
  { 
     $( '.button_area' ).draggable( 'option',  'revert', true ).trigger( 'mouseup' );
  } 
 }
 });​
于 2012-10-08T15:20:08.350 回答
2

在 sokie 和 Lunik 的帮助下,我做到了:jsFIDDLE SOLUTION

多谢你们。

$( ".button_area" ).draggable({});

$(".item").mouseout(function() {
    $( '.button_area' ).draggable( 'option',  'revert', true ).trigger( 'mouseup' );
});
于 2012-10-08T15:39:08.037 回答