如何在删除后删除 jquery 个可拖动项的子项
How to remove children of jquery draggable item after dropped
我使用父 li 元素作为可拖动元素,它是我唯一要拖动的元素,但是子 ul 及其子元素在 li 被删除后仍然存在。所以问题是,成功删除可拖动对象后,如何删除不再存在的项目的子项(因为我没有还原)
简单列表:
<ul>
<li class="draggable">Some text</li>
<ul>
<li class="child">More text</li>
<li class="child">More text</li>
</ul>
</li>
<ul>
<div class="droppable">This is the drop zone</div>
到目前为止,代码有一个 fiddle:
http://jsfiddle.net/wkrdgumb/1/
您可以在 start
事件中捕获父元素的上下文。删除元素后,您可以在 stop
事件中删除在 start
事件中捕获的元素:
$(function () {
var $context = $();
$(".contact-group").draggable({
revert: false,
refreshPositions: true,
drag: function (event, ui) {
ui.helper.addClass("draggable");
},
start: function (event, ui) {
$context = ui.helper.parent();
},
stop: function (event, ui) {
ui.helper.removeClass("draggable");
ui.helper.removeClass("contact-group");
$context.remove();
}
});
$(".send_to").droppable({
// ...
});
});
我使用父 li 元素作为可拖动元素,它是我唯一要拖动的元素,但是子 ul 及其子元素在 li 被删除后仍然存在。所以问题是,成功删除可拖动对象后,如何删除不再存在的项目的子项(因为我没有还原) 简单列表:
<ul>
<li class="draggable">Some text</li>
<ul>
<li class="child">More text</li>
<li class="child">More text</li>
</ul>
</li>
<ul>
<div class="droppable">This is the drop zone</div>
到目前为止,代码有一个 fiddle: http://jsfiddle.net/wkrdgumb/1/
您可以在 start
事件中捕获父元素的上下文。删除元素后,您可以在 stop
事件中删除在 start
事件中捕获的元素:
$(function () {
var $context = $();
$(".contact-group").draggable({
revert: false,
refreshPositions: true,
drag: function (event, ui) {
ui.helper.addClass("draggable");
},
start: function (event, ui) {
$context = ui.helper.parent();
},
stop: function (event, ui) {
ui.helper.removeClass("draggable");
ui.helper.removeClass("contact-group");
$context.remove();
}
});
$(".send_to").droppable({
// ...
});
});