Question

我有一个容器

<div id="contenitore" class="connectedSortable"></div>

使用此Jq代码

$( "#contenitore" ).sortable({
update: function(event, ui){
ElementAppend();},
connectWith: ".connectedSortable"
}).disableSelection();

和其他div一样

<div class="element-container"></div>

使用此Jq代码来处理某些拖动事件

$("div.element-container").draggable({ 
  cursor: "move", cursorAt: { top: 20, left: 20 },
  drag: function(event, ui) {
  $(this).addClass("handled");
  },
  stop: function(event, ui) {
       $(this).removeClass("handled");
    },
  }).disableSelection();

所以所有的SIM卡工作正常，但如果我添加

connectToSortable: ".connectedSortable"

to draggable我得到了这个奇怪的错误

TypeError：e（...）。data（...）未定义

和代码剂量工作

我试图找到一个解决方案，如果可以帮助谁回答。

之前的代码是wpress teme。所以我在一个简单的HTML JS页面中尝试了所有内容，现在错误是

TypeError：$（...）。data（...）未定义

var o = $（this）.data（“ui-draggable”）。options;

在这个jQuery UI代码中 - v1.10.3 - 2013-08-05

所以我发了一个类ui-draggable添加到div但仍然无法正常工作

Answer 1

将connectToSortable放入draggable功能。

jQuery Part：

  $("#container").sortable({  
     receive: function(event,ui){  
        ui.item.remove();
     }
   });

  $("#element-container").draggable({
      connectToSortable: "#container",
      helper: "clone",
      revert: "invalid"
  });

HTML部分：

  //First
  <div id="container"></div>
  //Second
  <div id="element-container"></div>

Jquery可拖动的可排序

1 个答案: