js實(shí)現(xiàn)input密碼框提示信息的方法(附html5實(shí)現(xiàn)方法)
本文實(shí)例講述了js實(shí)現(xiàn)input密碼框提示信息的方法。分享給大家供大家參考,具體如下:
今天我們主管說要在密碼框加入個(gè)"請(qǐng)輸入密碼"的提示信息,第一次的時(shí)候本來想著用修改input type 屬性的方法呢,結(jié)果有某些特別的瀏覽器不支持,IE的input的type屬性是只讀的,不能動(dòng)態(tài)設(shè)置.所以換其它的方法,實(shí)例如下:
<input type="text" onfocus="changeTip(this);" id="passText" name="passText" value="請(qǐng)輸入密碼"/> <input style="display: none;" type="password" onblur="changeTip(this);" id="pass" placeholder="" name="pass" value=""/> <script type="text/javascript"> function changeTip(th){ var passText = document.getElementById('passText'); var pass = document.getElementById('pass'); if(th.id == 'pass'){ if(th.value == '' || th.value.length == 0 ){ passText.style.display=''; pass.style.display='none'; } }else{ passText.style.display='none'; pass.style.display=''; pass.focus(); } } </script>
補(bǔ)充:
其實(shí)上面一大段的代碼,用html5的一個(gè) placeholder 屬性就解決了.代碼如下:
PS:這里再為大家推薦一款非常好用的JavaScript壓縮、格式化與加密工具,功能非常強(qiáng)大(對(duì)于想讓代碼加密的朋友不妨試試這里的js加密功能):
JavaScript壓縮/格式化/加密工具:http://tools.jb51.net/code/jscompress
另外,上面這款js工具中的加密使用的是eval函數(shù)加密形式,對(duì)此本站還提供了如下這款針對(duì)eval函數(shù)加密的解密工具,非常強(qiáng)大實(shí)用!
js的eval方法在線加密解密工具:http://tools.jb51.net/password/evalencode
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
- JavaScript實(shí)現(xiàn)密碼框輸入驗(yàn)證
- JS實(shí)現(xiàn)密碼框效果
- JS實(shí)現(xiàn)表單中點(diǎn)擊小眼睛顯示隱藏密碼框中的密碼
- js實(shí)現(xiàn)input密碼框顯示/隱藏功能
- JS實(shí)現(xiàn)密碼框的顯示密碼和隱藏密碼功能示例
- 基于JS實(shí)現(xiàn)密碼框(password)中顯示文字提示功能代碼
- JavaScript實(shí)現(xiàn)輸入框(密碼框)出現(xiàn)提示語
- JavaScript如何實(shí)現(xiàn)在文本框(密碼框)輸入提示語
- JS實(shí)現(xiàn)密碼框根據(jù)焦點(diǎn)的獲取與失去控制文字的消失與顯示效果
- javascript 密碼框防止用戶粘貼和復(fù)制的實(shí)現(xiàn)代碼
- js正則實(shí)現(xiàn)的密碼框簡單制作,還可以替換成自己想用得符號(hào)
- javascript解鎖前端密碼框常見功能做法
相關(guān)文章
JavaScript & jQuery完美判斷圖片是否加載完畢
本文主要介紹了JavaScript & jQuery完美判斷圖片是否加載完畢的方法。具有一定的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01利用JS測試目標(biāo)網(wǎng)站的打開響應(yīng)速度
本文簡單說明利用JS來測試目標(biāo)網(wǎng)站的打開響應(yīng)速度,方法簡單明了大家一看就明白并附上了腳本源碼2017-12-12uniapp上傳圖片和上傳視頻的實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于uniapp上傳圖片和上傳視頻的實(shí)現(xiàn)方法,文中還介紹了上傳文件的方法,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-01-01javascript中undefined與null的區(qū)別
在JavaScript中存在這樣兩種原始類型:Null與Undefined。這兩種類型常常會(huì)使JavaScript的開發(fā)人員產(chǎn)生疑惑,在什么時(shí)候是Null,什么時(shí)候又是Undefined?2015-08-08微信小程序中使用自定義字體的實(shí)現(xiàn)與體驗(yàn)優(yōu)化
由于微信支持的字體非常有限,不能滿足個(gè)性化的需求,因此在開發(fā)的過程中可能會(huì)需要使用自定義字體,下面這篇文章主要給大家介紹了關(guān)于微信小程序中使用自定義字體的實(shí)現(xiàn)與體驗(yàn)優(yōu)化的相關(guān)資料,需要的朋友可以參考下2022-02-02Javascript 調(diào)試?yán)?Firebug使用詳解六
有時(shí)候,為了更清楚方便的查看輸出信息,我們可能需要將一些調(diào)試信息進(jìn)行分組輸出,那么可以使用console.group來對(duì)信息進(jìn)行分組,在組信息輸出完成后用console.groupEnd結(jié)束分組。2009-07-07JS獲取子、父、兄節(jié)點(diǎn)方法小結(jié)
這篇文章主要介紹了JS獲取子、父、兄節(jié)點(diǎn)方法總結(jié)及JS獲取兄弟節(jié)點(diǎn)的兩種方法,需要的朋友可以參考下2017-08-08JavaScript中創(chuàng)建類/對(duì)象的幾種方法總結(jié)
這篇文章主要是對(duì)JavaScript中創(chuàng)建類/對(duì)象的幾種方法進(jìn)行了詳細(xì)的總結(jié)介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-11-11微信小程序tab左右滑動(dòng)切換功能的實(shí)現(xiàn)代碼
這篇文章主要介紹了微信小程序tab左右滑動(dòng)切換功能的實(shí)現(xiàn)代碼,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-02-02動(dòng)態(tài)加載js、css的實(shí)例代碼
這篇文章主要介紹了動(dòng)態(tài)加載js、css的實(shí)例代碼的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值,感興趣的朋友一起看看吧2016-05-05