輸入密碼檢測(cè)大寫(xiě)是否鎖定js實(shí)現(xiàn)代碼
網(wǎng)站登錄為了更好的用戶體驗(yàn)都會(huì)在輸入密碼的時(shí)候檢測(cè)是否開(kāi)啟大寫(xiě)。提醒用戶。
在下面的 input框里測(cè)試下吧!這段代碼來(lái)之 <點(diǎn)我>。
不過(guò)我做了一點(diǎn)小改進(jìn)。
主要對(duì) 已經(jīng)激活input框的 大寫(xiě)鎖定進(jìn)行實(shí)時(shí)檢測(cè)。
<div>
<input class="text" name="passwd" id="loginPasswd" type="password" style="*display:block;" />
<div style="color:#F90;padding:2px; position:absolute; display:none;" id="capital">大寫(xiě)鎖定已開(kāi)啟</div>
<script type="text/javascript"><!--
(function(){
var inputPWD = document.getElementById('loginPasswd');
var capital = false;
var capitalTip = {
elem:document.getElementById('capital'),
toggle:function(s){
var sy = this.elem.style;
var d = sy.display;
if(s){
sy.display = s;
}else{
sy.display = d =='none' ? '' : 'none';
}
}
}
var detectCapsLock = function(event){
if(capital){return};
var e = event||window.event;
var keyCode = e.keyCode||e.which; // 按鍵的keyCode
var isShift = e.shiftKey ||(keyCode == 16 ) || false ; // shift鍵是否按住
if (
((keyCode >= 65 && keyCode <= 90 ) && !isShift) // Caps Lock 打開(kāi),且沒(méi)有按住shift鍵
|| ((keyCode >= 97 && keyCode <= 122 ) && isShift)// Caps Lock 打開(kāi),且按住shift鍵
){capitalTip.toggle('block');capital=true}
else{capitalTip.toggle('none');}
}
inputPWD.onkeypress = detectCapsLock;
inputPWD.onkeyup=function(event){
var e = event||window.event;
if(e.keyCode == 20 && capital){
capitalTip.toggle();
return false;
}
}
})()
// --></script>
</div>
相關(guān)文章
怎樣調(diào)用動(dòng)態(tài)獲取的自定義對(duì)象的方法
怎樣調(diào)用動(dòng)態(tài)獲取的自定義對(duì)象的方法...2006-10-10解決BootStrap Fileinput手機(jī)圖片上傳顯示旋轉(zhuǎn)問(wèn)題
這篇文章主要介紹了 BootStrap Fileinput手機(jī)圖片上傳顯示旋轉(zhuǎn)問(wèn)題,需要的朋友可以參考下2017-06-06微信小程序 自定義彈窗實(shí)現(xiàn)過(guò)程(附代碼)
這篇文章主要介紹了微信小程序 自定義彈窗實(shí)現(xiàn)過(guò)程(附代碼),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12JavaScript調(diào)用瀏覽器打印功能實(shí)例分析
這篇文章主要介紹了JavaScript調(diào)用瀏覽器打印功能的方法,實(shí)例分析了針對(duì)各種常用瀏覽器調(diào)用打印功能的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07JavaScript實(shí)現(xiàn)簡(jiǎn)單購(gòu)物小表格
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡(jiǎn)單購(gòu)物小表格,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-09-09layui字體圖標(biāo) loading圖標(biāo)靜止不旋轉(zhuǎn)的解決方法
今天小編就為大家分享一篇layui字體圖標(biāo) loading圖標(biāo)靜止不旋轉(zhuǎn)的解決方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09JavaScript 阻止超鏈接跳轉(zhuǎn)的操作方法(多種寫(xiě)法)
很多朋友問(wèn)小編能否通過(guò)JavaScript來(lái)阻止超鏈接的跳轉(zhuǎn)呢,今天給大家通過(guò)多種寫(xiě)法來(lái)實(shí)現(xiàn)這一功能,具體實(shí)例代碼跟隨小編一起看看吧2021-06-06JavaScript利用正則表達(dá)式來(lái)禁止鍵盤(pán)輸入數(shù)字
本文主要介紹了JavaScript利用正則表達(dá)式來(lái)禁止鍵盤(pán)輸入數(shù)字,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06