1

给定keydown浏览器中的事件，我如何预测该键事件是否会导致字符输入？例如，按左箭头不输入字符，但a按键输入 A（除非ctrl或alt向下）。

我不需要知道将输入什么字符，只需要知道按键事件是否会导致输入。

我的目标是 Chrome。如果您的解决方案在 IME 中有效，则可以加分。

注意：我问的是keydown事件，而不是像keypressor之类的下游事件oninput。

4

3 回答 3

0

有一个 HTML 5 事件：input. MDN：https ://developer.mozilla.org/en-US/docs/Web/Reference/Events/input 。除此之外没有合适的解决方案。

好的，我想我有一个解决方案。我不知道它有多好，但它确实有效。看看：http: //jsfiddle.net/tLPsL/

它基本上是保存输入的值onkeydown并将其签入onkeyup.

$('#sattar').keydown(function() {
    window.SATTAR = $(this).val();
});

$('#sattar').keyup(function() {
    if(window.SATTAR !== $(this).val()) {
        alert("changed");
    }
});
于 2013-06-15T14:38:21.110 回答
0

[更新]

用这个

$(document).keydown(function(event){
    console.log(event.which);
});

并根据您的需要使用 ascii 值过滤 event.which 的值，并排除带有不需要的按钮出现的数字

例如（此示例演示仅接受小写字母）：

$(document).keydown(function(event){
    var x = event.which;
    if (x <= 90 && x >=65) console.log('accepted');
    else console.log('not accepted');
});

JSFiddle

[更新]：

如果您不喜欢这种方法，您可以使用另一个检测到任何文本字段或文本区域的输入的方法：

$('input,textarea').change(function(){
    console.log('input detected!');
});
$(document).keyup(function(event){
    var x = $(event.target);
    if (x[0].nodeName == 'INPUT' || x[0].nodeName == 'TEXTAREA'){ //you can filter the backspace if you don't want to consider it a change on the input by anding it with the whole argument here using the key number explained above
        x.blur().focus();
    }
});

演示

注意：第一种方法适用于所有语言，因为相同的键盘键用于输入不同字符，但它们仍然可以键入。

于 2013-06-15T14:50:30.163 回答
-1

来源&&提示：

我在这个网站上看到了字符 keydata 列表。
- 为了使其跨平台和跨浏览器，我建议你观看这个网站- 你可以在这里
测试 keydown 事件。 -Jquery 还建议使用 key ，因为它可以规范化 keycode 和 charcode（我认为这对跨浏览器部分很有用，但我没有找到像我之前发布的 keycode 那样的表格），请参阅此处的详细信息。

最后，一个个人的想法：我这样说不会显得粗鲁，所以请尝试理解，你有 3 个清晰有效的答案，你应该有兴趣改进细节以使其按你的需要工作，特别是因为，由于许多原因（例如时间、硬件问题、没有人付钱给我们、自由职业者网站在其他地方等等），帮助您的人可能无法完成您的全部工作。

编辑

考虑到你的需要，我写了这段代码，记住组合键很难处理，所以，你应该在重用之前测试这个例子。小提琴

<!DOCTYPE html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).keydown(
    function(event){
        if(event.target!='[object HTMLBodyElement]'){//Are we in an input?
            if(!event.ctrlKey && !event.altKey){//Are we using a combo ctrl or alt?
                if(event.keyCode==13 || event.keyCode==8 || event.keyCode==32 || (event.keyCode>45 && event.keyCode<91) || event.keyCode==188 || (event.keyCode>189 && event.keyCode<193) || (event.keyCode>218 && event.keyCode<222)){
                    //It is a char?
                    document.getElementById('valid').innerHTML+=event.keyCode+' ';
                    document.getElementById('idlast').innerHTML=event.target.id; 
                }
            }
        }
    }
);
</script>
</head>
<body>
<input id="a" type="text"></input>
<textarea id="b">a</textarea>
<div id="c" contenteditable="true">a</div>
<div id="d" style="width:200px;height:200px;background-color:red">a</div>
last keydown in: <span id="idlast"></span><br>
for keypress in input:<span id="valid"></span><br>
</body>
</html>

结束编辑

首先，如果焦点位于不是输入（textarea，contenteditable...）的对象上，则您的目标是正文。因此，如果目标是身体，请确保您没有在某处写作。

然后我建议你看看这个例子，keypress 可能对你的目标有用，因为它似乎没有注册不是输入的键。

    <!DOCTYPE html>
    <head>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script>
$(document).keypress(
    function(event){
        if(event.target!='[object HTMLBodyElement]'){
            document.getElementById('valid').innerHTML=document.getElementById('valid').innerHTML+event.keyCode+' ';
            document.getElementById('idlast').innerHTML=event.target.id;            
        }else{
            document.getElementById('out').innerHTML=document.getElementById('out').innerHTML+event.keyCode+' ';
        }
    }
);

$(document).keydown(function(e){document.getElementById('down').innerHTML=document.getElementById('down').innerHTML+e.keyCode+' ';});
    </script>
    </head>
    <body>
    <input id="a" type="text"></input>
<textarea id="b">a</textarea>
<div id="c" contenteditable="true">a</div>
<div id="d" style="width:200px;height:200px;background-color:red">a</div>
last keypress input id: <span id="idlast"></span><br>
for keypress in input:<span id="valid"></span><br>
for keypress out:<span id="out"></span><br>
for keydown:<span id="down"></span><br>
    </body>
    </html>
于 2013-06-15T15:59:17.703 回答