停止IE11从输入类型编号中删除文本 [英] Stop IE11 removing text from input type number

问题描述

在Internet Explorer 11中，如果您有以下内容：

 < input type =numbermin =1 max =12pattern =[0-9] *> 
  

当用户试图输入字母而不是数字时，浏览器会清除输入。这种行为是不可取的，因为我希望我们的验证来处理这个问题，而不是浏览器自动为我做。

有人知道如何改变这种行为吗？ stack.imgur.com/ZPDFR.gifalt =示例图像>

我使用数字输入类型进行验证，并获取正确的键盘iOS。

JSFiddle演示。

解决方案

其他浏览器可能会保留此文本，但在输入中输入aaa类型属性设置为number的c $ c>元素意味着元素的值属性为空，因此您的验证方法很可能将此视为缺乏内容而非非数值。

 <输入type =numbervalue =aaa/> 
  

console.log .querySelector（ '输入'）值）。
>


我已经改变了你的JSFiddle演示来反映这个： http://jsfiddle.net/e1132tg5/3/ 。

如果你需要接受输入元素中的非数字数据，那么解决方法很简单，就是将元素的类型更改为文本而不是数字，并且完全依靠自己的JavaScript验证方法来处理验证（因为它看起来你是想要的）。

 < input type =text> 
  

您也可以使用JavaScript来确定用户是否正在移动设备上查看您的网站，动态更改类型属性。

另一种解决方案是通知用户该字段必须是数字if元素会变得模糊不清（IE自动删除后），但在 SE的UserExperience网站上讨论会更好。

In Internet Explorer 11, if you have the following:

<input type="number" min="1" max="12" pattern="[0-9]*" >

When a user tries to input letters rather than numbers, the browser just clears the input. This behaviour is undesirable as I want our validation to handle this, rather than the browser automatically doing it for me.

Does anybody know how to change this behaviour?

I'm using the number input type for validation and also to get the correct keyboard in iOS.

JSFiddle demo.

解决方案

Other browsers may keep this text present, however entering "aaa" into an input element whose type attribute is set to "number" will mean that your element's value property is empty, so your validation method would most likely regard this as a lack of content rather than a non-numerical value anyway.

<input type="number" value="aaa" />

console.log(document.querySelector('input').value);
> ""

I've altered your JSFiddle demo to reflect this: http://jsfiddle.net/e1132tg5/3/.

If you need to accept non-numerical data in your input element then the solution is quite simply to change your element's type to "text" instead of "number" and rely solely on your own JavaScript validation methods for handling the validation (as it appears you want anyway).

<input type="text" >

You can always also use your JavaScript to determine whether the user is viewing your site on a mobile device and change the type attribute dynamically.

An alternate solution would be to inform the user that the field must be numerical if the element is blurred with no text present (after IE's automatic removal), but this would be better discussed on SE's UserExperience site.

这篇关于停止IE11从输入类型编号中删除文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！