Question

我使用jquery-ui sortable，我在浏览拖动项时的方式时遇到了麻烦。我想要的是拖动时红色bg容器内部组件的文本值。请帮忙

这是我到目前为止所得到的http://jsfiddle.net/Fyd48/5/。这大约有90％的工作时间。如果你拖动super dooper它的颜色是红色的，就像我想要的那样，但它仍然有灰色框，这使它看起来很奇怪。，我不知道那个灰盒子来自哪里，但请帮忙删除它。

$( "#container" ).sortable({
start: function(event, ui){        
   var text = $.trim(ui.item.text());
   ui.item.startHtml = ui.item.html();

   ui.item.html('<div style="display: inline-block;" class="rf-ind-drag default drag">' + text + '</div>');
},
stop: function(event, ui){ 
   ui.item.html(ui.item.startHtml);
}
});
$( "#container" ).disableSelection();

Answer 1

您在每个可拖动的div中都有background-color: rgb(245, 245, 245);作为css样式，如果删除它，拖动时灰色框就不会存在。

小提琴：http://jsfiddle.net/Fyd48/10/

Answer 2

灰色背景来自这些DIV：

<div style="border: 0px; background-color: rgb(245, 245, 245); padding: 0px; position: relative; background-position: initial initial; background-repeat: initial initial;" class="default ui-draggable">

您在拖动时创建的红色DIV小于包含div，让父背景颜色透过。尝试在红色DIV上设置height和width到100%：

ui.item.html('<div style="display: inline-block; width:100%; height: 100%" class="rf-ind-drag default drag">' + text + '</div>');

（当然最好将样式属性放在样式标记中，而不是使用内联样式）

jquery sortable：更改当前拖动项的css

2 个答案: