删除元素时，JQuery保留可拖动性

Question

我正在尝试在DOM中移动一个可拖动元素，但每当我尝试使用replaceWith（）或remove（）或类似函数时，它的可拖动性就会丢失。

在DOM中移动元素时，是否可以使元素不会失去其可拖动性？

Answer 1

解决方案是不使用jQuery来移动元素，而是使用纯DOM。

即代替

$('#elem').remove().appendTo($('#elem2'))

DO

var q = $('#elem'); var el = q.get(0); el.parentNode.removeChild(el); $('#elem2').appendChild(el);

我不知道是否推荐，但它确实有效。

Answer 2

为什么不在遍历DOM后再尝试创建可拖动的行为：

function xyz(){
    //move your stuff
    //create the draggable again

    $(element).draggable();
}

Answer 3

不，除非你修改jquery核心（我不建议这样做），否则在替换/删除DOM中的元素时不可能保留可拖动性。

对DOM元素执行replaceWith()和remove()意味着它们被销毁，因此与它们相关的任何行为或事件也会被销毁。

尝试创建一个包含可拖动行为的外部<div>，而当您想要在删除时更改可拖动项目时替换div内的HTML

或者（不太优雅），您可以在执行draggable()之后再次对元素调用replaceWith()，以恢复使用replaceWith()删除的行为。

同样地，代替remove()尝试hide()来简单地让元素消失一段时间但保留其行为。

简而言之：您正在接近问题。改变你的方法。