Question

我正在构建一系列输入字段，这些字段会在达到最大长度时自动显示。这通过检查ng-keyup事件上的值的长度来工作，但这有一个小问题，可以通过使用oninput事件来解决。但是，这似乎不存在于Angular中？

我试图解决的问题：

当我快速输入最大字符数（在我的情况下是两位数，可以很快输入）时，第一个keyup在输入两个字符后触发，并标记到下一个字段。第二个keyup仅在标签后注册，因此它会在下一个字段上触发。这会导致不必要的行为。

要重现检查this fiddle（jQuery，因为它允许我快速重现我正在寻找的问题和解决方案），请填写＆＃34;月＆＃34;和＆＃34;年＆＃34;字段然后在＆＃34; day＆＃34;中快速输入2位数字。领域。当做得足够快时，焦点会一直跳到＃34;年＆＃34; （因为第二个keyup被解雇了，而＃34;月＆＃34;被关注了。

使用.on('input', ...)时，此问题会消失。但是，我想在jQuery中使用它，而在Angular中使用它作为属性，如ng-keyup。这是可能的，如果不是，我怎么能以另一种方式解决这个问题呢？

Answer 1

看起来你在那个jsfiddle中使用了jquery。而是以角度来绑定oninput事件，您可以使用：

大多数情况下，这种DOM操作必须在指令内部。只是为了演示，我将它添加到控制器：

angular.element(document.querySelectorAll("input")).on("input", function (event) {

    var $input = angular.element(event.target),
        maxlength = $input.attr('max').length;

    if (this.value.length >= maxlength) {
        this.nextElementSibling.tagName==="INPUT" ? this.nextElementSibling.focus() : this.blur();
    }

});

<强> DEMO

AngularJS中的oninput事件属性

1 个答案: