RobinHerbots的jQuery输入掩码不适用于IE8(WinXP)

时间:2016-01-06 19:07:18

标签: javascript jquery html internet-explorer-8 jquery-inputmask

我的场景:我正在尝试使用jQuery Inputmask Plugin屏蔽一些输入字段。它适用于Chrome,Opera,Safari,IE10,Firefox,但不适用于IE8!

我创建了一个虚拟页面来测试其他脚本是否在干扰,但事实并非如此。

HTML

<!doctype html>
<html>
<head>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.js"></script>
    <script type="text/javascript" src="inputmask/jquery.inputmask.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.extensions.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.dependencyLib.jquery.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.numeric.extensions.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.phone.extensions.js"></script>
    <script type="text/javascript" src="inputmask/inputmask.regex.extensions.js"></script>
    <!--[if lte IE 8]>
    <script type="text/javascript" src="js/ie8customscripts.js"></script>
    <link href="css/ie8customstyles.css" rel="stylesheet" type="text/css">
    <![endif]-->
    <!--[if IE 9]>
    <script type="text/javascript" src="js/ie9customscripts.js"></script>
    <link href="css/ie9customstyles.css" rel="stylesheet" type="text/css">
    <![endif]-->
</head>
<body>
    cpf<br/><input id="cpf" type="text"></input>
    cnpj<br/><input id="cnpj" type="text"></input>
</body>
</html>

JS(ie8customscripts.js)

$(function(){  
   $("#cpf").inputmask("99-9999999");  //static mask
   $("#cnpj").inputmask({"mask": "(999) 999-9999"}); //specifying options
});

在我的实际页面中,我使用data-属性来设置掩码,这显然不适用于IE8,所以我试着这样做。

这是抛出错误的确切行(它被抛出约20次)。

inputmaskerror

直到我知道,它应该在IE8上运行,对吧?

2 个答案:

答案 0 :(得分:1)

IE8及以下版本不支持indexOf。你可以自己填充它,但是你正在修改一个原生对象的原型,这是非常狡猾的。但是,嘿,那是IE游戏的名称。

if (!Array.prototype.indexOf) {
  Array.prototype.indexOf = function(elt /*, from*/)  {
    var len = this.length >>> 0;

    var from = Number(arguments[1]) || 0;
    from = (from < 0)
         ? Math.ceil(from)
         : Math.floor(from);
    if (from < 0)
      from += len;

    for (; from < len; from++)
    {
      if (from in this &&
          this[from] === elt)
        return from;
    }
    return -1;
  };
}
信用:@NickCraver Why doesn't indexOf work on an array IE8?

答案 1 :(得分:1)

我不知道你使用的是哪个版本的jQuery和jquery.inputmask但我昨天在IE8上运行的jQuery 1.8.3和jquery.inputmask 3.3.x版本遇到了同样的问题。所以我对jquery.inputmask进行了一些调查,我发现它依赖于jQuery.inArray方法同时提供字符串和数组参数。我已经检查了jQuery 1.8.3,1.10.2,1.11.3,1.12.4版本,情况完全一样。

以下是inArray方法的jQuery实现:

inArray: function( elem, arr, i ) {
    var len;

    if ( arr ) {
        if ( Array.prototype.indexOf ) {
            return Array.prototype.indexOf.call( arr, elem, i );
        }

        len = arr.length;
        i = i ? i < 0 ? Math.max( 0, len + i ) : i : 0;

        for ( ; i < len; i++ ) {
            // Skip accessing in sparse arrays
            if ( i in arr && arr[ i ] === elem ) {
                return i;
            }
        }
    }

    return -1;
},

哟可以看看Array.prototype.indexOf是否存在将执行本机实现。因此IE11,Chrome,Firefox没有问题,因为它们具有IE8中缺少的Array.prototype.indexOf的原生实现。

因此在IE8中将执行这部分代码:

        len = arr.length;
        i = i ? i < 0 ? Math.max( 0, len + i ) : i : 0;

        for ( ; i < len; i++ ) {
            // Skip accessing in sparse arrays
            if ( i in arr && arr[ i ] === elem ) {
                return i;
            }
        }

此代码与Antiga建议的相同 - 所以在你的代码中你也会使用$ .inArray

但是使用字符串参数调用inArray(如jquery.inputmask那样)而不是数组导致 i in arr 行中的异常,因为操作对字符串无效。 这就是为什么我在我的应用程序中使用了以下覆盖(当然包括jquery.js之后)(在我的公司IE8中仍然使用):

$.inArray = function (elem, arr, i) {
    var len;
    if (arr) {
        if (typeof arr === "string") {
            // this is my extension
            return arr.indexOf(elem, i);
        } else {
            if (Array.prototype.indexOf) {
                return Array.prototype.indexOf.call(arr, elem, i);
            }
            len = arr.length;
            i = i ? (i < 0 ? Math.max(0, len + i) : i) : 0;
            for (; i < len; i++) {
                // Skip accessing in sparse arrays
                if (i in arr && arr[ i ] === elem) {
                    return i;
                }
            }
        }
    }
    return -1;
};

这解决了与jQuery 1.8 +,jquery.inputmask 3.3.x和IE8合作相关的所有问题。