Question

当我打开登录页面时，如果大写锁定打开，我需要立即显示大写锁定已打开。我看到了一些像

这样的帖子

this哪个在keypress中显示。但我想在页面加载后立即显示。我如何使用jQuery做到这一点。请帮助我。谢谢。

Answer 1

有一个名为capslockstate的jQuery插件，它将监视整个页面上的大写锁定键的状态，而不仅仅是在特定的字段中。

您可以查询大写锁定键的状态，也可以定义事件侦听器以响应状态更改。

该插件比其他建议更好地进行检测和状态管理，包括使用非英语键盘，监控Caps Lock键本身的使用，以及在键入非字母字符时不忘记状态。

有两个演示，one showing basic event binding和另一个showing the warning only when the password field has focus。

e.g。

$(document).ready(function() {

/* 
* Bind to capslockstate events and update display based on state 
*/
$(window).bind("capsOn", function(event) {
    $("#statetext").html("on");
});
$(window).bind("capsOff", function(event) {
    $("#statetext").html("off");
});
$(window).bind("capsUnknown", function(event) {
    $("#statetext").html("unknown");
});

/*
* Additional event notifying there has been a change, but not the state
*/
$(window).bind("capsChanged", function(event) {
    $("#changetext").html("changed").show().fadeOut();
});

/* 
* Initialize the capslockstate plugin.
* Monitoring is happening at the window level.
*/
$(window).capslockstate();

// Call the "state" method to retreive the state at page load
var initialState = $(window).capslockstate("state");
$("#statetext").html(initialState);});

和

$(document).ready(function() {

/* 
* Bind to capslockstate events and update display based on state 
*/
$(window).bind("capsOn", function(event) {
    if ($("#Passwd:focus").length > 0) {
        $("#capsWarning").show();
    }
});
$(window).bind("capsOff capsUnknown", function(event) {
    $("#capsWarning").hide();
});
$("#Passwd").bind("focusout", function(event) {
    $("#capsWarning").hide();
});
$("#Passwd").bind("focusin", function(event) {
    if ($(window).capslockstate("state") === true) {
        $("#capsWarning").show();
    }
});

/* 
* Initialize the capslockstate plugin.
* Monitoring is happening at the window level.
*/
$(window).capslockstate();});

The code for the plugin可在GitHub上查看。

Answer 2

抱歉，您无法在页面加载时获得键盘按钮的状态。你必须分析一个按键的keyCode。这是唯一的方法。

查看此帖子：detect caps lock status on page load (or similar)

show caps lock使用jQuery打开

2 个答案: