仅在显示占位符文本时更改 jEditable 控件中的字体

Question

我有一个 div，我正在用这样的代码将它变成一个 jEditable 控件：

         $(".ed-fld").editable("/url",
            {
              placeholder: "(Edit)", 
              tooltip: "Click to edit", 
              indicator: "Saving. . ."
            } 
         );

效果很好。

现在，我想添加一个效果，当控件显示占位符文本时，它会显示为灰色。当控件包含实际文本时，它应该遵循常规样式。

这可以通过 jEditable 实现吗？

Answer 1

placeholder 字符串直接分配给元素的 innerHTML，因此您可以在其中包含带有类的 HTML 标记，例如

$('.ed-fld').editable('/url', {
    ...
    placeholder: '<span class="placeholder">(Edit)</span>'
});

然后您可以设置placeholder 类的样式，例如

.placeholder { color: gray }

查看实际操作：http://jsfiddle.net/william/6VUHh/40/。