IE 11不考虑输入数字并允许输入非数字值

Question

浏览器IE 11允许将非数字值输入到数字输入中。我已经在其他浏览器（例如Chrome和Firefox）中进行了测试，他们尊重数字输入。

此图显示了用户如何在IE 11中输入逗号和字母“ gal”。

<div class>
    <input type="number" min="0" onkeydown="return event.keyCode !== 69" class="form-control questTxt" value="">
</div>

IE 11不支持数字输入吗？该资源似乎表明确实如此？LINK TO RESOURCE

Answer 1

正如epascarello所说，type属性是用于验证的，因此，如果您在数字字段中输入文本并尝试提交表单，它将不允许您使用。我无法告诉您为什么不是number输入的默认值，但是自从存在浏览器以来，浏览器兼容性一直很痛苦。

如果您希望用户实际上无法输入数字以外的任何内容，则可以使用JavaScript进行。

const inputField = document.querySelector("input");

inputField.addEventListener("keypress", e => {
    if (e.which > 31 && (e.which < 48 || e.which > 57)) {
        e.preventDefault();
    }
});

Answer 2

类似IE 11浏览器，输入类型为Number时有一些问题。

您可以在CanIuse站点上参考IE浏览器的已知问题。

作为解决方法，您可以使用此JS函数。

function handleKeyPress(e) {
    let newValue = e.target.value + e.key;
    if (
    // It is not a number nor a control key?
    isNaN(newValue) && 
    e.which != 8 && // backspace
    e.which != 17 && // ctrl
    newValue[0] != '-' || // minus
    // It is not a negative value?
    newValue[0] == '-' &&
    isNaN(newValue.slice(1)))
        e.preventDefault(); // Then don't write it!
}

Insert a number:
<input onKeyPress="handleKeyPress(event)"/>

参考：

input type=“number” not working in IE browser