获得可拖动元素的实时位置

时间:2013-05-17 09:32:24

标签: javascript jquery html

我想知道你是否有人知道如何解决以下问题:

我有很多div

<div id="one"></div>
<div id="two"></div>
<div id="three"></div>

并且它们都可以用jquery ui

拖动
var $divs = $('#one, #two, #three')
$divs.draggable({   
     start: dragStart, cursor: 'move', stop: dragEnd        
      });

我想要的是实时获取被拖动元素的当前位置,以便如果拖动的div是例如触发事件:

if($('#two').position().left <= 500) { /*baadaboom*/ }

我将div拖到

的位置
  

左边是1000px

立即如果

  

小于500px

它应该开火!

2 个答案:

答案 0 :(得分:5)

您可以尝试以下

var $divs = $('#one, #two, #three')
$divs.draggable({
    start: dragStart, cursor: 'move', stop: dragEnd,
    drag: function () {
        var t = $(this), l = $(this).offset().left;
        t.text(l);

        if(l < 500){
           t.text('Badaboom');
        }
    }
});

Fiddle

答案 1 :(得分:0)

获取全局变量var position并在单击div进行拖动时设置它。然后你可以使用这个变量进行比较。