如何在jQuery設置後更改：-moz-placeholder顏色？

我遇到了一個問題，如果輸入字段的背景顏色發生變化，佔位符顏色會混入太多。如何在jQuery設置後更改：-moz-placeholder顏色？

我已經解決了可讀的文本顏色問題，所以它正確地返回適當的亮或暗的顏色。

我不能爲我的生活弄清楚如何將CSS屬性設置爲特定輸入框的計算顏色。請給一些指導？

input:-moz-placeholder 
{ 
    color: #BBBBBB; 
} 
input::-webkit-input-placeholder 
{ 
    color: #BBBBBB; 
}

返回的顏色是#222222但$('#input').css()不能正常工作，因爲它直接，而不是針對元素的CSS元素。

來源

2012-07-09 Etienne Marais

在此方案中，我第一次動態樣式塊追加到<頭>在頁面加載：

// add style block to the <head> with default placeholder css on page load 
var defaultColor = 'BBBBBB'; 
var styleContent = 'input:-moz-placeholder {color: #' + defaultColor + ';} input::-webkit-input-placeholder {color: #' + defaultColor + ';}'; 
var styleBlock = '<style id="placeholder-style">' + styleContent + '</style>'; 
$('head').append(styleBlock);

然後，改變佔位符文本顏色我剛剛更新的樣式塊的內容：

var randomColor = Math.floor(Math.random()*16777215).toString(16); 
styleContent = 'input:-moz-placeholder {color: #' + randomColor + ';} input::-webkit-input-placeholder {color: #' + randomColor + ';}' 
$('#placeholder-style').text(styleContent);

檢查出的jsfiddle：

Change placeholder text color with jQuery

來源

2012-07-09 13:24:04

我很感謝你爲這個偉大的解決方案。它像一個魅力工作：D – 2012-07-10 09:29:40

如何在jQuery設置後更改：-moz-placeholder顏色？

回答

相關問題