Question

我只是注意到按键事件的顺序并没有在Firefox和IE上以相同的方式执行：在Firefox上，如果你在一个焦点输入上按键，字符写在框中，然后附加到事件的函数被解雇了。在IE上它恰恰相反。

所以这是我的问题，我有两个输入文本彼此相邻，当我在第一个中写一个单个字符时，我希望第二个字符刚刚获得焦点。这在Firefox上完美运行，但在IE上却没有，因为在第一个字符写入之前它会切换到第二个输入...

这是我正在使用的代码的简化（两个元素都是文本输入）：

        var one = document.getElementById('one');
        var two = document.getElementById('two');

        one.addEventListener('keypress', function(e) {
            e.target.nextElementSibling.focus();
        });

我该如何解决这个问题？如何在屏幕上出现按下的键后指示切换焦点？

Answer 1

我猜你可以这样使用setTimeout：

var one = document.getElementById('one');
var two = document.getElementById('two');

one.addEventListener('keypress', function(e) {
    setTimeout((function(elem){
        return function(){
            elem.focus();
        };
    })(e.target.nextElementSibling),0);
});

<input id="one" type="text"/><input id="two" type="text"/>

setTimeout将在下一个执行堆栈上触发该函数，因此在元素填充后。

Answer 2

焦点切换似乎发生在之前而不是之后。

使用.focus延迟焦点转移，以便在输入字符后稍后调用e。
将当前元素（文本的去向）拉出^\w+[.\w-]*\w+@\w+[.\w-]*\w+(\.\w{2,3})+$，然后使用切换切换焦点，而不是立即切换焦点。由于您总是在切换后，它应该适用于两种浏览器。

IE上的Keypress事件序列

2 个答案: