我可以用CSS選擇空的textareas嗎？

有沒有一種方法，我可以選擇一個文本，從而$('#id_of_textarea').val() jQuery中會''？我嘗試使用:empty。我看到CSS提供了一種選擇空輸入的方法，因爲文本位於value屬性（[value=""]）中。是否有textarea中的文本屬性？我可以用CSS選擇空的textareas嗎？

我正在尋找一個選擇，將與CSS工作，不只是jQuery的。

來源

2011-08-16 Ben Atkin

我能想到的最好的解決辦法是CSS 3的解決方法。將該字段設置爲必填項（如果需要，可以在提交時取消設置）。然後你可以使用

textarea:invalid { /* style here... probably want to remove box-shadow and such */ }

來源

2011-08-16 01:42:05 Ktash

http://jsfiddle.net/7YdP5/真棒，在鉻中工作。 –

令人驚歎！也適用於Safari。和Firefox。這是基於標準的，儘管它讓我改變了自己的邏輯。 –

@Ktash聰明的工作。很有幫助！ –

-3

您可以使用CSS :empty僞類。

看看jsfiddle一個例子。

在這個例子中有一個按鈕，動態地添加新的空文本域的DOM，所以你可以看到，新的元素也與僞類的影響。

在該示例中的代碼在Firefox 5.0，歌劇11.50和鉻中測試12.

此外，可以看到的一個很好的描述：空僞類here。

來源

2011-08-16 01:33:10 diosney

請參閱對此建議的其他人的評論。它只在最初才起作用，而不是一旦輸入。 – Ktash

Okey，我看不到該評論，感謝您指出它;） – diosney

-2

對於使用AngularJS誰是，你可以在視圖中使用ng-class一類添加到您的textarea知道這是否是空的。

HTML：

<textarea ng-model="myForm.myTextArea" 
      ng-class="(myForm.myTextArea.length)?'not_empty':'empty'"> 
</textarea>

CSS：

textarea.empty { 
    background-color:red; 
} 
textarea.not_empty { 
    background-color:blue; 
}

這裏是一個jsfiddle。

來源

2015-09-07 14:16:35 PatateKiller

根據我的測試，jQuery'.val（）'反映了當前的文本內容，而jQuery'.text（）'反映了原始HTML中標籤之間的文本。此外，CSS選擇器'：empty'檢查原始HTML中標籤之間的文本（如jQuery'.text（）'）。 CSS選擇器'[value =「」]'似乎根本不起作用。參見[jsfiddle]（http://jsfiddle.net/Anr6U/19/） –

我可以用CSS選擇空的textareas嗎？

回答

相關問題