Jquery:可拖曳的敏感性

时间:2016-08-24 01:49:43

标签: javascript jquery jquery-ui jquery-ui-draggable

我有一个使用jquery的可拖动DOM元素。

如果客户点击它而不移动,则不会调用可拖动的开头,并且它的行为就像它没有可拖动。

当客户点击它并在按住时将鼠标移动1个像素时,拖动开始。事件被触发,类被应用等......

只有当客户点击元素并将鼠标移动至少10px时,是否有办法触发拖动启动?

注意:这与滚动无关。

来自https://jqueryui.com/draggable/的实时演示的代码示例:

<style>#draggable { width: 150px; height: 150px; padding: 0.5em; }</style>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>

<script>
$(function(){
    $("#draggable").draggable(); 
    //goal is to only starts dragging if mouse moved more than 10px
});
</script>

<div id="draggable" class="ui-widget-content">
    <p>Drag me around</p>
</div>

1 个答案:

答案 0 :(得分:3)

看起来您想要使用'distance'属性。 http://api.jqueryui.com/draggable/#option-distance

“mousedown之后的像素距离,鼠标必须先移动才能开始拖动。此选项可用于防止在单击元素时出现不必要的拖动。”

$( "#draggable" ).draggable({
  distance: 10
});