2

我想为不支持<input type="number">.

这很容易检测到，因为在这些浏览器中，input您设置为的任何位置type都会number报告type为text. 到目前为止这么好。

所以我想做的是<input type="number">为这些旧浏览器找到每个事件并连接事件。

问题是：我如何找到它们？

  • $('input[type=number]').length === 0（当然）。
  • $('input[name=aKnownNumberField]')[0].type === 'text'同样，这并不奇怪，因为这是首先用于特征检测的检查。
  • $($('input[name=aKnownNumberField]')[0]).parent().html().indexOf('type="number"')（或任何类似的 HTML 检查）也会失败，因为返回的 HTML 将是根据浏览器的 DOM 的。

请注意，我在示例中使用了 jQuery，但我很高兴得到非 jQuery 答案。

如何<input type="number">在不支持它们的浏览器中检测？

4

2 回答 2

4

如果您使用的是 jQuery，则可以使用以下方法获取它们.filter()：

var $unsupported = $('input').filter(function() {
    return this.type !== $(this).attr('type');
});

这将选择所有不受支持的输入，因此您可能希望进一步使用.filter('[type="number"]')或在过滤功能中进行过滤。

纯 JS 解决方案并没有太大的不同：

var inputs = document.getElementsByTagName('input');

for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].type === inputs[i].getAttribute('type')) {
        continue;
    }

    // inputs[i] isn't supported by the browser
}

还有一个演示： http: //fiddle.jshell.net/PENRD

我在 IETester 中对其进行了测试，它可以运行到 IE6。

于 2013-06-13T19:03:00.503 回答
1 
$.expr[':'].realtype = function(objNode,intStackIndex,arrProperties,arrNodeStack)
{
  return $(objNode).attr('type')===arrProperties[3];
}

var numbers=$('input:realtype("number")');

jsfiddle: http://jsfiddle.net/kingmotley/3sMQf/2/

于 2013-06-13T19:33:47.733 回答