删除元素后如何从元素中删除 "draggable" 属性？

Question

大家晚上好。仍在处理我的 DnD 项目，DnD 工作令人满意，但所有项目在被删除后仍保持可拖动。我想在删除 draggable 属性后将其删除。我该如何管理？顺便说一句，我已经用谷歌搜索了几个小时。 TIA 代码如下...

$(function() {
  $(".tier").draggable({
    cursor: "grab",
    revert: true
  });

$(".target.droppable").droppable({
      accept: ".tier",
      tolerance: "pointer",
      drop: function(event, ui) {
        ui.draggable.attr("style", "margin: 0; border: 0;").appendTo(this);
        ui.draggable.attr("draggable", false);
        n = ui.draggable.attr("src");
        dr = ui.draggable.attr("draggable");
        console.log("Draggable:" + dr);
        // console.log("Image Filename:" + n);
        tn = n.substr(4, 1);
        // console.log("Tiernummer:" + tn);
        x = (this).cellIndex;
        // console.log("Dropped Index:" + x);
        index = $(this).closest("tr").index();
        console.log("Dropped tr:" + index);
        t = parseInt(tn, 10);
        (this).setAttribute("draggable", false);
                checkright(t, x);
      }



});
});

Answer 1

它是 class，所以只需删除 class，例如 ui.draggable.removeClass('draggable').removeClass('tier');

$(".target.droppable").droppable({
      accept: ".tier",
      tolerance: "pointer",
      drop: function(event, ui) {
        ui.draggable.attr("style", "margin: 0; border: 0;").appendTo(this);
        ui.draggable.removeClass('draggable').removeClass('tier');
        ui.draggable.attr("draggable", false);
        n = ui.draggable.attr("src");
        dr = ui.draggable.attr("draggable");
        console.log("Draggable:" + dr);
        // console.log("Image Filename:" + n);
        tn = n.substr(4, 1);
        // console.log("Tiernummer:" + tn);
        x = (this).cellIndex;
        // console.log("Dropped Index:" + x);
        index = $(this).closest("tr").index();
        console.log("Dropped tr:" + index);
        t = parseInt(tn, 10);
        (this).setAttribute("draggable", false);
                checkright(t, x);
      }
});

Answer 2

考虑以下因素。

$(function() {
  $(".tier").draggable({
    cursor: "grab",
    revert: true
  });

  $(".target.droppable").droppable({
    accept: ".tier",
    tolerance: "pointer",
    drop: function(event, ui) {
      var dropped = ui.draggable.attr("style", "margin: 0; border: 0;").appendTo(this);
      dropped.draggable("destroy");
      n = dropped.attr("src");
      dr = dropped.attr("draggable");
      console.log("Draggable:" + dr);
      // console.log("Image Filename:" + n);
      tn = n.substr(4, 1);
      // console.log("Tiernummer:" + tn);
      x = $(this).index();
      // console.log("Dropped Index:" + x);
      index = $(this).closest("tr").index();
      console.log("Dropped tr:" + index);
      t = parseInt(tn, 10);
      $(this).attr("draggable", false);
      checkright(t, x);
    }
  });
});

最好对任何 jQuery UI 对象使用 destroy。查看更多：https://api.jqueryui.com/draggable/#method-destroy

Removes the draggable functionality completely. This will return the element back to its pre-init state.

删除元素后如何从元素中删除 "draggable" 属性？

How do you remove the "draggable" attribut from an element once it's been dropped?

jquery

jquery-ui

drag-and-drop