iOS上的Safari中的shiftKey

Question

是否有任何方法可以在javascript中确定是否在移动键盘上按下shift键,并将其与大写锁定区分开(两次按下shift键)

Answer 1

一些事实

首先,让我们看一下我认为你已经知道的关于iOS键盘的一些事实:

• 进入键盘模式时,shift始终激活该键
• Caps Lock 必须手动激活(我想这不是太广泛使用)

iPhone Shift键处理

我对这个问题进行了一些调查,这是我发现的:

• 该shift键可触发无按键事件

• 除了iOS应用程序(duh)之外,没有特殊的iPhone浏览器API来检测是否按下了shift键

• 的keydown,keypress,keyup通过iOS的触发事件看起来正常,但他们并不表明Shift键,使用,而且除了自己的时间戳和类型无法区分.

• 由于此问题,您无法在iOS中手动调度键盘事件,keyCode并且which只读并始终设置为0.重新触发键盘事件以获得关于换档键仍然打开的一些指示是不可能的.

• 实际上,iPhone将shift钥匙视为某种Short Term Caps Lock钥匙.不同之处在于,通常情况下,您只需激活一次,它就会自动停用.

可以做些什么

我假设您要在输入字段上指示用户是否应该小心按下Shift/Caps Lock(例如,密码字段).我想出的是某种解决方法,但我认为这比什么都没有好.

你也可以在这里测试jsfiddle.

DOM设置

<div id="wrapper">
  <label for="test">ENTER SOMETHING HERE</label>
  <input type="text" name="test" id="test"/>
</div>
<div id="warning"></div>?

使用Javascript

这检查用户确实输入了大写输入,并假设用户正在使用,caps lock如果输入了两个大写字母.

var isCaps = false,
isUppercase = false,
str = '',
test = document.getElementById('test'),
warning = document.getElementById('warning');

function capsDetection(e) {

    // Since where on iOS, we at least don't have to care 
    // about cross-browser stuff
    var s = String.fromCharCode(e.which);
    isCaps = isUppercase;

    // if the char doesn't match its lower case friend, and the shift key is 
    // not pressed (which is always the case on iOS, but we leave it there 
    // for readability), we have uppercase input
    isUppercase = (s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey);

    // if its the second uppercase input in a row, we may have caps lock input
    isCaps = isCaps && isUppercase;

    // set the warning
    if (isUppercase && !isCaps) {
        str = 'You where using the shift key';
    }
    else if (isCaps) {
        str = 'Caps lock seems to be activated';
    } else {
        str = '';
    }
    warning.innerHTML = str;
}

// the right event properties are only available on keypress
test.addEventListener('keypress', capsDetection);

正如我所说的,如果你需要知道在没有用户做任何输入的情况下按下shift键的话,最好不要做任何事情.那现在似乎是不可能的.