javascript - 仅使 div 的一部分可拖动

标签 javascript html draggable handle

如何在 Javascript 中创建类似于 jquery 的“可拖动句柄”的东西?

(不幸的是,Jquery 不适合我。)

我有一个名为“dxy”的 div,其中还有另一个名为“draggable_handle”的 div。目前我可以将dxy拖动到我按下的任何地方。我该如何制作才能拖动dxy,但只有当我按下draggable_handle并且div中没有​​其他地方时?

<div id="dxy">
  <div id="draggable_handle">
    <p>
    Draggable part
    </p>
  </div>
</div>

我制作了一个 JsFiddle,这将使我的意思更清楚,在这里:http://jsfiddle.net/Lk2hLthp/7/

请添加一些代码示例或jsfiddle,因为我是新手。 =)

最佳答案

将事件监听器添加到内部元素而不是外部元素,如下所示:

function addListeners() {
  document.getElementById('draggable_handle').addEventListener('mousedown', mouseDown, false);
  window.addEventListener('mouseup', mouseUp, false);
}

关于javascript - 仅使 div 的一部分可拖动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37015524/

相关文章:

html - 防止两个引导容器相互重叠。?

javascript - HTML/CSS/JS : How to force browser to save password from a non -'password' type input?

html - Bootstrap 3 - 一行中的单列,但不是 col-md-12

jquery - 如何禁用 jquery 可拖动对象上的文本选择?

javascript - Fabric.js 中支持的文本更改事件

javascript - 替换背景图像的平滑方法

javascript - 从 Node.js 中所需的类调用外部函数

javascript - 闭包和 CoffeeScript 的范围

javascript - 如何使用 Jquery 使内部 div 触发对外部 div 的拖动效果?

Javascript模态可拖动弹出窗口