在我的研究中,我发现当按下大写键时如何检测大写锁定。但是,即使在未触摸按键的情况下,我也想知道大写状态。
例如: alert(ui.Keyboard.capslock)//将返回true或false;
谢谢!
答案 0 :(得分:2)
不,您无法在页面加载时获得键盘按钮的状态。你必须分析一个按键的keyCode。这是唯一的方法。
答案 1 :(得分:1)
我刚刚提出了一种替代方案,它将检测大写锁定的状态并将其存储,以便在按下大写锁定键时可以打开和关闭警告。我只编码chrome 45+和ie9 +所以如果这是你的计划,可能需要对一般用途进行一些调整。
这是我的html:
<input type="text" id="pwd">
<p id="caps"></p>
这是js:
var LOGINPAGE = LOGINPAGE || {};
LOGINPAGE.CAPSdetect = {};
$(function() {
LOGINPAGE.CAPSdetect.engage();
});
LOGINPAGE.CAPSdetect.isDetected = false;
LOGINPAGE.CAPSdetect.capsOn = false;
LOGINPAGE.CAPSdetect.engage = function() {
$('#pwd').on('keypress', LOGINPAGE.CAPSdetect.shiftDetect);
$(window).on('keydown', LOGINPAGE.CAPSdetect.capsDetect);
}
LOGINPAGE.CAPSdetect.shiftDetect = function(event) {
var caps = $('#caps');
var which = event.keyCode;
var shift = event.shiftKey;
var targ = event.target;
if ((which >= 65 && which <= 90 && !shift) || (which >= 97 && which <= 122 && shift)) {
caps.html('CAPS LOCK IS ON').css('color', 'crimson');
LOGINPAGE.CAPSdetect.isDetected = true;
LOGINPAGE.CAPSdetect.capsOn = true;
} else if((which >= 65 && which <= 90 && shift) || (which >= 97 && which <= 122 && !shift)){
caps.html('');
}
}
LOGINPAGE.CAPSdetect.capsDetect = function(event) {
if(event.keyCode === 20 && LOGINPAGE.CAPSdetect.isDetected) {
LOGINPAGE.CAPSdetect.capsOn = (LOGINPAGE.CAPSdetect.capsOn)? false:true;
if(LOGINPAGE.CAPSdetect.capsOn) {
$('#caps').html('CAPS LOCK IS ON');
} else {
$('#caps').html('');
}
}
}
我正在使用命名空间来避免isDetected
和capsOn
的全局变量,因此在某些函数和变量之前需要LOGINPAGE.CAPSdetect.
。请参阅this jsfiddle,了解没有命名空间并进行测试。
答案 2 :(得分:1)
尝试以下代码:
<script language="Javascript">
function capLock(e){
kc = e.keyCode?e.keyCode:e.which;
sk = e.shiftKey?e.shiftKey:((kc == 16)?true:false);
if(((kc >= 65 && kc <= 90) && !sk)||((kc >= 97 && kc <= 122) && sk)){
document.getElementById('divon').style.visibility = 'visible';
document.getElementById('divoff').style.visibility = 'hidden';
}else{
document.getElementById('divon').style.visibility = 'hidden';
document.getElementById('divoff').style.visibility = 'visible';
}
}
</script>
<input type="text" name="trackcaps" onkeypress="capLock(event)" />
<div id="divon" style="visibility:hidden">Caps Lock is on.</div>
<div id="divoff" style="visibility:hidden">Caps Lock is off.</div>