|
HTML5里面一個(gè)非常不錯(cuò)的擴(kuò)展功能就是可以在文本框上面增加占位文本。占位文本(PlaceHolder)是指當(dāng)一個(gè)文本框沒有被focus的時(shí)候顯示的是提示文字,當(dāng)他被點(diǎn)擊之后就顯示空白。這個(gè)功能很不錯(cuò),但是并不是所有的瀏覽器都支持。這篇文章就來討論一下怎樣用比較簡(jiǎn)單的方法可以讓所有瀏覽器都支持這個(gè)特性。
傳統(tǒng)的解決辦法
在我們有這個(gè)屬性之前,我們一般是通過Javascript來實(shí)現(xiàn)這個(gè)效果。 這段文字被設(shè)置在value屬性里面,當(dāng)聚焦了之后,檢驗(yàn)文本框的值是否等于默認(rèn)值,如果是則清空文本框。當(dāng)文本框失去焦點(diǎn)的時(shí)候,再檢查是否為空,為空則再寫上默認(rèn)值。這個(gè)方法很不高效,而且每個(gè)文本框都得去檢測(cè)。
<input type="text" value="Search" onfocus="if (this.value == 'Search')
{this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}">
it知識(shí)庫:跨瀏覽器的HTML5占位文本(PlaceHolder)方案,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除,多謝。