当一个对象从一个div拖放到另一个div时,li中的格式仅对文本进行更改。我希望它以相同的格式和风格,即删除它后的'li'。
$(function() {
$("#catalog ul").sortable({
zIndex: 10000,
revert: true
});
$("#catalog").accordion();
$("#catalog ul").draggable({
appendTo: "body",
helper: "clone",
zIndex: 10000
});
$("#dialogIteration ol").droppable({
activeClass: "ui-state-default",
hoverClass: "ui-state-hover",
drop: function(event, ui) {
$(this).find(".placeholder").remove();
$("<li></li>").text(ui.draggable.text()).appendTo(this);
}
}).sortable({
items: "li:not(.placeholder)",
sort: function() {
// gets added unintentionally by droppable interacting with sortable
// using connectWithSortable fixes this, but doesn't allow you to customize active/hoverClass options
$(this).removeClass("ui-state-default");
}
});
$("ul, li").disableSelection();
$("#dialogIteration").dialog();
});
答案 0 :(得分:0)
原始列表中的项<li class="ui-state-default"/>
的样式由CSS规则定义:
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: 1px solid lightGrey;
background: #E6E6E6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
font-weight: normal;
color: #555;
}
...
在将其拖动到新容器并将其删除后,您创建了另一个元素来保存与原始元素不具有相同className的内容$("<li></li>").text(ui.draggable.text())
,因此样式将被删除。
您可以通过将其更改为
来修复它$('<li class="ui-state-default" />').text(ui.draggable.text()).appendTo( this )