如何获得<inputtype=“number”>字段的原始值？

Question

如何获得<inputtype=“number”>字段的原始值？我怎么才能拿到“真实”a值<input type="number">田野？我有一个input框，我使用的是更新的HTML 5输入类型number:<input id="edQuantity" type="number">Chrome 29主要支持这一点：我现在需要的是阅读“生”值，则为用户在输入框中输入的值。如果用户输入了一个数字：然后edQuantity.value = 4一切都很好。但是，如果用户输入无效文本，我希望将输入框涂上红色：不幸的是type="number"输入框，如果文本框中的值不是数字，则value返回空字符串：edQuantity.value = "" (String);(至少在Chrome 29中)我怎么才能拿到“生”a值<input type="number">控制室？我试着查看Chrome输入框的其他属性列表：我没有看到任何与实际输入类似的东西。我也想不出这个盒子“空”或者不是。也许我可以推断：value          isEmpty        Conclusion=============  =============  ================"4"            false          valid number""             true           empty box; not a problem""             false          invalid text; color it red注：在水平规则之后，你可以忽略所有的事情；这只是证明问题合理的补充。还有：不要把例子和问题混淆起来。人们可能出于某些原因想得到这个问题的答案。其他而不是将方框涂成红色(例如：转换文本)"four"进入拉丁语"4"在onBlur事件期间的符号)我怎么才能拿到“生”a值<input type="number">控制室？奖金阅读jsFiddle以上所有内容(更新)新输入类型的Quirkmode.org条目

Answer 1

它没有回答问题，但有用的解决办法是检查

edQuantity.validity.valid

这个ValidityState对象提供用户输入内容的线索。考虑type="number"输入min和max集

<input type="number" min="1" max="10">

我们总想用.validity.valid.

其他财产只提供奖金信息：

User's Input  .value  .valid | .badInput  .rangeUnderflow  .rangeOverflow
============  ======  ====== | =========  ===============  ==============
""            ""      true   | false      false            false  ;valid because field not marked required
"1"           "1"     true   | false      false            false  
"10"          "10"    true   | false      false            false
"0"           "0"     false  | false      true             false  ;invalid because below min
"11"          "11"    false  | false      false            true   ;invalid because above max
"q"           ""      false  | true       false            false  ;invalid because not number
"³"           ""      false  | true       false            false  ;superscript digit 3
"٣"           ""      false  | true       false            false  ;arabic digit 3
"₃"           ""      false  | true       false            false  ;subscript digit 3

在使用之前，您必须确保浏览器支持HTML 5验证：

function ValidateElementAsNumber(element){
   //Public Domain: no attribution required.
   if ((element.validity) && (!element.validity.valid))
   {
      //if html5 validation says it's bad: it's bad
      return false;
   }

   //Fallback to browsers that don't yet support html5 input validation
   //Or we maybe want to perform additional validations
   var value = StrToInt(element.value);
   if (value != null)
      return true;
   else
      return false;}

奖金

他删除了一个有用的答案：

只需使用CSS:invalid这个选择器。

input[type=number]:invalid {
    background-color: #FFCCCC;}

这将触发您的元素在输入非数字有效时变为红色。

浏览器支持<input type='number'>与:invalid所以没问题。

阅读更多关于:invalid这里.

Answer 2

input.focus();document.execCommand("SelectAll");var displayValue = window.getSelection().toString();