ng-blur不会在输入编号的firefox上触发事件

Question

我想在firefox上使用带有html输入(type = number)元素的ng-blur .

我发现的问题是,当使用输入数字的向上和向下箭头时,模糊和焦点事件都不会被firefox触发,而chrome工作正常.

您可以在http://jsfiddle.net/chonw54e/重现该问题

<div ng-app ng-init="focus=false;blur=false;active=false">
    <input type="number" ng-class="{ myFocus: focus, myBlur: blur }"    ng-focus="focus=true;blur=false;" ng-blur="blur=true;focus=false;">
    <p>focus: {{focus}}</p>
    <p>blur: {{blur}} </p>
</div>

只需加载页面(同时使用firefox和chrome),然后单击html输入编号的上/下箭头

输入号码

我究竟做错了什么？

谢谢您的帮助!

编辑: 11/12/2015

@ Arg0n的解决方案解决了这个问题.但是,它看起来像firefox或angularjs的问题.

我刚刚创建的角GitHub上的问题在这里

这不是一个有角度的问题.这是由于firefox的事件行为在单击输入内的箭头时没有聚焦输入(在我看来这是一个错误).

编辑:14/12/2015

在bugzilla中创建的Firefox问题:https://bugzilla.mozilla.org/show_bug.cgi ？ id = 1232233

Answer 1

您可以使用jQuery解决这个问题，看到这个小提琴：

的JavaScript

$(function(){
  $("input[type='number']").on("click", function(){
    $(this).focus();
  });
});

没有jQuery的，看这个：

的JavaScript

document.onreadystatechange = function() {
  if (document.readyState == "complete") {
    var inputs = document.querySelectorAll('[type="number"]');
    for (var i = 0; i < inputs.length; i++) {
      inputs[i].onclick = function() {
        this.focus();
      }
    }
  }
}

这将迫使浏览器专注于input单击时。（Input与type集到number）。