jQuery UI Sortable的占位符无法更改背景颜色。

Question

我可以成功地更改占位符的边框颜色，但是当我尝试更改背景颜色时，没有任何反应。

这个jsfiddle代码最好解释了它：http://jsfiddle.net/EUVrK/1/

- Kosta Kontos

Answer 1

根据jQuery UI Sortable文档，您可以为占位符提供CSS类。您应该能够在此类中指定背景。

使用占位符和forcePlaceholderSize属性，它可以完美地工作。我已更新链接 希望这有所帮助。

- p0wl

---

感谢您抽出时间来帮助p0wl。这个解决方案确实有效。但是它使用了一个不同的代码布局/结构，与我所需的不同，即需要将样式分离为CSS类，并使用foreplaceholderSize设置为true来继承宽度参数。当然，它可以解决问题，但在我的另一个答案中概述的解决方案（来自IRC上的其他人）只需要在原始问题的代码中添加一个额外的jQuery代码行。它非常优雅。也许你也发现它很有用？无论如何，还是要谢谢您 :) - Kosta Kontos

你说得很对，但这取决于观点。我喜欢区分JavaScript和CSS。尽管使用jquery-ui的标准参数可能会有优点（例如，可以使用get方法读取它）。 - p0wl

将JavaScript和CSS分开，就像您所做的那样，确实是更好的做法。因此，我将投票支持您的答案作为正确答案（因为问题标题没有提到对ui.placeholder进行低级调整）。 - Kosta Kontos

Answer 2

我在irc.freenode上得到了一位朋友的帮助，他建议了以下解决方案，可以解决问题。

ui.placeholder.css("visibility", "visible");
ui.placeholder.css("background-color", "red");

占位符的背景颜色没有显示出来，因为实际元素不可见（我猜测默认情况下设置为隐藏）。因此，将其设置为可见可以看到不同的背景颜色。

- Kosta Kontos

---

非常好。这是完美的。 - Maciek Semik

你也可以通过 ui.placeholder.css({"visibility":"visible","background-color":"red"}); 来缩短代码。 - Maciek Semik

这段代码应该放在“start”可排序事件中。 ui.placeholder.css('visibility', 'visible'); ui.placeholder.css('background-color', 'red'); }``` - Chaikitty

Answer 3

CSS：

.placeholderBackground{background-color:#FD6FB7;}

PARAMETER： $('.sortable').sortable({ axis: 'y', placeholder: 'placeholderBackground' }).disableSelection();

- Vedat Taylan