快捷導(dǎo)航

關(guān)于文本框默認(rèn)值的操作js代碼

更新時(shí)間：2012年01月12日 10:53:05 作者：

搜索框，文本框，文本域，文本區(qū)域可能都要有個(gè)默認(rèn)值

比如：
搜索框:可以 <input value="搜索產(chǎn)品..." />
文本區(qū)域: 可以 <textarea>輸入您多我的建議或者意見,讓我們的網(wǎng)站為您創(chuàng)造更便捷的服務(wù)....</textarea>
........
首先說這種提示功能很好，非常直觀，可是怎么讓它們獲取焦點(diǎn)時(shí)內(nèi)容清空、失去焦點(diǎn)后內(nèi)容分為空的話就顯示提示文本.....
當(dāng)頁面這些元素多了之后如何去管理...等等問題

復(fù)制代碼代碼如下:

 
var inputText=function(o,e,e2){ 
if(!o)return;var txt=o.value; 
function inputTextChange(o,e,e2,txt){ 
o[e]=function(){var txt2=o.value;if(txt==txt2)o.value=""} 
o[e2]=function(){var txt2=o.value;if(txt2=="")o.value=txt} 
} 
new inputTextChange(o,e,e2,txt) 
} 

上面我定義了一個(gè)函數(shù)
功能講解：
參數(shù) [o] : 需要操作的對象
參數(shù) [e] : 需要清空對象值的事件
參數(shù) [e2] : 需要返回默認(rèn)值的事件
函數(shù)調(diào)用：
inputText（userName,"onmouseover","onmouseout"）;
函數(shù)應(yīng)用示例：

復(fù)制代碼代碼如下:

 
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>input.value</title> 
</head><body> 
<script> 
var inputText=function(o,e,e2){if(!o)return;var txt=o.value; 
function inputTextChange(o,e,e2,txt){ 
o[e]=function(){var txt2=o.value;if(txt==txt2)o.value=""} 
o[e2]=function(){var txt2=o.value;if(txt2=="")o.value=txt}} 
new inputTextChange(o,e,e2,txt) 
} 
</script> 
<input type="text" value="請輸入您的郵箱..." on /> 
<input type="text" value="請輸入您的家庭住址..." /> 
<input type="text" value="請輸入您的手機(jī)號..." /> 
<script> 
var inputArr=document.getElementsByTagName("input") 
for(var i in inputArr){ 
if(!inputArr[i].type=="text") continue; 
inputText(inputArr[i],"onfocus","onblur") 
} 
</script> 
</body></html> 

您可能感興趣的文章:

文本框默認(rèn)值

相關(guān)文章

使用smartupload組件實(shí)現(xiàn)jsp+jdbc上傳下載文件實(shí)例解析
這篇文章主要介紹了使用smartupload組件實(shí)現(xiàn)jsp+jdbc上傳下載文件實(shí)例解析,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-01-01
OpenLayers實(shí)現(xiàn)點(diǎn)要素圖層的聚合顯示的方法
在很多情況下，點(diǎn)要素圖層中的要素?cái)?shù)量可能會成百上千，如果一個(gè)點(diǎn)要素圖層中的點(diǎn)數(shù)量很多，我們就會采取圖層聚合的方式對其進(jìn)行處理，本文就來介紹一下，感興趣的可以了解一下
2021-09-09
js驗(yàn)證表單大全
js驗(yàn)證表單大全...
2006-11-11
關(guān)于foreach循環(huán)中遇到的問題小結(jié)
這篇文章主要介紹了關(guān)于foreach循環(huán)中遇到的問題總結(jié),非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-05-05
微信小程序?qū)崿F(xiàn)登錄注冊界面
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)登錄注冊界面，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-08-08
IE6下出現(xiàn)JavaScript未結(jié)束的字符串常量錯(cuò)誤的解決方法
JavaScript文件只在IE6下出錯(cuò)（“未結(jié)束的字符串常量”）的解決辦法。
2010-11-11
微信小程序畫布圓形進(jìn)度條顯示效果
這篇文章主要為大家詳細(xì)介紹了微信小程序畫布圓形進(jìn)度條顯示效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-07-07
DOM節(jié)點(diǎn)深度克隆函數(shù)cloneNode()用法實(shí)例
這篇文章主要介紹了DOM節(jié)點(diǎn)深度克隆函數(shù)cloneNode()用法,實(shí)例分析了cloneNode()函數(shù)深度復(fù)制的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-01-01
JS中關(guān)于ES6?Module模塊化的跨域報(bào)錯(cuò)問題解決
這篇文章主要介紹了JS中關(guān)于ES6?Module模塊化的跨域報(bào)錯(cuò),ES6模塊化提供了export命令和import?命令，對于模塊的導(dǎo)出和引入，本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下
2023-07-07
js實(shí)現(xiàn)addClass,removeClass,hasClass的函數(shù)代碼
js實(shí)現(xiàn)addClass,removeClass,hasClass的函數(shù)代碼，需要的朋友可以參考下。
2011-07-07