表單沒有清除默認值？

Question

我注意到這是一個很常見的問題許多 wbesites，即使是那些大公司，所以作爲一個網絡開發商申請工作，我認爲，我應該知道如何解決這個問題。

例如，基本上，用戶名字段會顯示「用戶名」，直到您點擊它來輸入用戶名，此時它應該清除文本「用戶名」。但在大多數情況下，它不會，並且您最終會在原有文本的中間輸入內容。

我看了這個，我發現最好的解決方案是一組30多行的Javascript函數，它完全符合你的期望：設置一個系統，當用戶點擊時清除默認值只要他們沒有進入任何東西，它們也會在點擊時將它放回原處。

但那不是我真正想要的，因爲我已經知道如何去做。

我覺得現在，用HTML5和所有，應該有一個更簡單的修復。而不僅僅是將JavaScript簡化爲更短的jQuery腳本。我的意思是更多的嵌入式固有修復。

有誰知道有什麼方法可以阻止這種現象發生？

Answer 1

只需使用HTML5 placeholder attribute

<input type="text" placeholder="Whatever" /> 

Fiddle

跨瀏覽器的信息： 一些火狐版本清除文本框中單擊佔位符文本和Chrome在用戶開始輸入後將其清除，但Firefox的後續版本就像chrome一樣，它會在用戶開始輸入時清除佔位符文本輸入框。

Answer 2

可以使用HTML5佔位符屬性http://www.w3schools.com/html5/att_input_placeholder.asp

Answer 3

現代瀏覽器都支持的形式佔位符屬性，讓你怎麼做你的使用modenizr爲跨瀏覽器兼容

Answer 4

只使用HTML5佔位符屬性要求

退房 http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text 對於文章。

<input type="text" placeholder="Username" /> 

這顯然不會完全跨瀏覽器兼容，因此您仍然需要舊的Javascript/jQuery修復程序。