jsplumb 可拖动不工作。答案

【问题标题】：jsplumb draggable not working.jsplumb 可拖动不工作。
【发布时间】：2015-06-10 21:47:50
【问题描述】：

我似乎无法弄清楚为什么我的 jsplumb 不工作。我创建了一个非常简单的 sippet 示例（附在这篇文章中）。

jsPlumb.ready(function() {

  jsPlumb.draggable($('.square'))

  jsPlumb.connect({
    source: "element1",
    target: "element2"
  });

});

.square {
  background-color: red;
  width: 50px;
  height: 50px;
  position: absolute;
}

<body>
  <h1>Hello World!</h1>

  <div id="element1" class="square"></div>
  <div id="element2" class="square" style="left:300px"></div>


  <script data-require="jquery@*" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
  <script data-require="jsplumb@*" data-semver="1.7.2" src="https://cdnjs.cloudflare.com/ajax/libs/jsPlumb/1.4.1/jquery.jsPlumb-1.4.1-all-min.js"></script>

</body>

我已将我在 css 中的定位设置为绝对，但我不知道为什么我不能让它工作。我将它与工作示例进行了比较，并通读了文档，但没有成功。

非常感谢您对此提供任何帮助。

我哪里出错了？

【问题讨论】：

不知道出了什么问题，但如果我使用最新版本的 jsPlumb：jsplumbtoolkit.com/lib/jsPlumb-2.0.7-min.js 你的代码 sn-p 就可以了...

标签： draggable jsplumb

【解决方案1】：

尝试使用

elementsList = jsPlumb.getSelector('.square'); jsPlumb.draggable(elementsList);

else直接给元素 jsPlumb.draggable($('#element1')); jsPlumb.draggable($('#element2'));

【讨论】：

啊，不，我明白你的意思... 使用 ids.. 是的，我也试过了。

【解决方案2】：

一般来说，这种动画功能是在jquery-ui而不是核心jquery中实现的。 http://jqueryui.com/draggable/

我认为在这个早期版本的jsPlumb.js Draggable 操作依赖于jquery-ui。

尝试将 jquery-ui 库添加到您的代码中。我已将此添加到您的代码中并且它有效；

<script src="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>

【讨论】：