删除元素后如何从元素中删除“可拖动”属性?
Posted
技术标签:
【中文标题】删除元素后如何从元素中删除“可拖动”属性?【英文标题】:How do you remove the "draggable" attribut from an element once it's been dropped? 【发布时间】:2021-09-18 11:09:19 【问题描述】:大家晚上好。仍在处理我的 DnD 项目,DnD 的工作令人满意,但所有项目一旦被删除就保持可拖动状态。拖放后,我想删除可拖动属性。我该如何管理?顺便说一句,我已经在谷歌上搜索了几个小时。 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);
);
);
【问题讨论】:
【参考方案1】:这是一个类,所以只需像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);
);
【讨论】:
尊敬的@Kinglish 先生...我试过了,光标按原样改变了,但是当我长时间按住鼠标按钮时,我仍然可以拖动该项目。您还有其他有用的见解可能会有所帮助吗?不过还是感谢您的及时答复。 试试修改后的。我错过了您实际上是基于类tier
设置可拖动对象,因此在更新的代码中也将其删除。
亲爱的@Kinglish 先生:成功了。非常感谢。【参考方案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
完全删除可拖动功能。这会将元素返回到其初始化前的状态。
【讨论】:
以上是关于删除元素后如何从元素中删除“可拖动”属性?的主要内容,如果未能解决你的问题,请参考以下文章
使用 JQuery 在 Droppend 时停止删除可拖动元素