value
如果用的是value，我們想鼠標focus后默認文字消失，移開后默認文字又重現，可以這樣來寫。
<input type="text" value="請輸入手機號" class="inp-fon">
$(".inp-fon").focus(function(){
var oldValue = $(this).val();
if(oldValue == this.defaultValue){
$(this).val("").addClass('focus-fon');
}
}).blur(function(){
var oldValue = $(this).val();
if(oldValue == ""){
$(this).val(this.defaultValue).removeClass('focus-fon');;
}
});
請看下圖演示：
默認狀態：
QQ截圖20151230151150.jpg
focus狀態
QQ截圖20151230153438.jpg
說明：默認狀態是灰色的，然后focus后，輸入的字體會變成黑色的，上面的JS里就是通過添加和刪除樣式“focus-fon”來控制的。
placeholder
如果用的是placeholder，我們就不需要JS了，因為它本身就自帶focus和blur功能了。但是有時候設計師給我們的設計稿往往跟默認文字顏色是有區別的，那我們如何改變placeholder默認文字顏色呢，如下：
<input type="text" placeholder="請輸入手機號" class="inp-fon">
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #f00;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #f00;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #f00;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #f00;
}
一般都是用以上這種方法來處理，這里就不放demo了，比較簡單，如果想看效果，把代碼復制到網頁里查看。
