datepickerfield sencha touch 2 - 如何将默认 placeHolder 颜色从黑色更改为灰色？答案

【问题标题】：datepickerfield sencha touch 2 - how to change default placeHolder color from black to grey?datepickerfield sencha touch 2 - 如何将默认 placeHolder 颜色从黑色更改为灰色？
【发布时间】：2013-06-07 09:06:58
【问题描述】：

有：

{
    xtype: 'datepickerfield',
    placeHolder : 'Date',
}

作为结果，HTML 文件显示：

<input class="x-input-el x-form-field x-input-text" type="text" id="ext-element-121" name="date" placeholder="Date" style="color: red!important;">

不幸的是，“日期”一词显示为黑色，没有任何帮助。尝试了 CSS，placeHolder html5 的样式，阅读 Sencha Docs。没有任何帮助，尚未找到解决方案。

这不可能吗？

【问题讨论】：

标签： css html datepicker sencha-touch-2 placeholder

【解决方案1】：

您可以使用-webkit-text-fill-color 来做到这一点。

定位特定字段的最简单方法如下：

{
    xtype: 'datepickerfield',
    placeHolder : 'Date',
    cls: 'your-class'
}

.your-class .x-form-field {
    -webkit-text-fill-color: red;
}

编辑

要完成答案，您可能希望在用户选择日期后文本恢复为默认颜色，因此；在日期选择器更改事件上添加removeCls

例子

onDatePickerChange: function(this, date, options ) {
    this.removeCls('your-class');
}

【讨论】：

非常感谢您的扩展回答！有用。你让我很开心。

【解决方案2】：

你试过了吗：

::-webkit-input-placeholder {
    color: red !important;
}

【讨论】：

是的。它没有帮助。它会影响所有占位符，但 datepickerfield 的占位符除外。