Question

目前我正在创建一个页面。一些输入字段定义了maxlength，对于这样的字段，我想使它们可以在达到maxlength时将焦点移动到下一个输入。

这里我有以下代码段：

$("form input[type=text]").on('input',function () 
{
    if($(this).val().length == $(this).attr('maxlength')) 
    {
        $(this).next("input").focus();
    }
});

此代码在Chrome和Firefox中运行良好，但在IE中无效。因此，我寻找解决问题的解决方案。有人建议使用setTimeout（）方法来解决问题。所以我将代码修改为以下内容：

setTimeout(function(){ 
    $("form input[type=text]").on('input',function () 
    {
        if($(this).val().length == $(this).attr('maxlength')) 
        {
            $(this).next("input").focus();
        }
    });
}, 3000);

但它仍然无法在我的IE环境中运行。为了解决这个问题，我也试过了setInterval（）。这两者都没有帮助解决问题。因此，我想问一下如何实现我的目标。或者失败只是由于我以错误的方式使用了setTimeout（）方法？

Answer 1

对于IE，您需要使用settimeout函数，因为它是惰性的，例如：

 setTimeout(function() { $(this).next("input").focus(); }, 10);

Answer 2

似乎IE8及更早版本不支持oninput事件，因为您可以阅读here

但你可以替换这一行：

$("form input[type=text]").on('input', function ()

这一个：

$("form input[type=text]").on('keyup paste', function ()

我相信它甚至可以在旧的Internet Explorer中使用

修改

值得注意的是，当paste事件触发时，textfield的值不会立即更新。所以你必须等一下。代码如下所示：

$("form input[type=text]").on('keyup paste', function () { var _this = this; setTimeout(function() { if($(_this).val().length == $(_this).attr('maxlength')) { $(_this).next("input").focus(); } }, 10); //minimal setTimeout delay });

在setTimeout回调中this引用window对象，因此您应该“记住”_this变量中的文本字段，然后在回调中使用它

将焦点设置为下一个输入

2 个答案: