如何获取 <input> 的值 [重复]答案

【问题标题】：How to get the value of an <input> [duplicate]如何获取 <input> 的值 [重复]
【发布时间】：2014-07-28 09:56:36
【问题描述】：

如何获取 <input> 类型为 number 的标签的值？这听起来像是一个荒谬的问题，但在最近的¹ Chrome 更新中，如果在字段中输入了无效字符，则以下代码将不起作用：

element.value     //does not work as expected, will return ""

现在这令人沮丧。我正在使用这段代码来禁止无效字符：

$("element").on("input", function(){
    this.value = this.value.replace(/[^0-9]/g, "");
});

但是由于它现在返回""，如果输入了无效字符，整个字段将被清空。这种行为以前没有发生过，只是在最近的 Chrome 更新中。这在 Firefox 中运行良好（尽管我不需要在 Firefox 中使用它。）

有没有办法获得<input> 的确切值？谢谢。

¹：36.0.1985.49 beta-m

【问题讨论】：

见How to get the raw value an <input type="number"> field? - 简短回答，不要使用type=number :(
@akxlr - 嗯，这很有趣。我可以在 Chrome 35 中获取该字段的值，但在 Chrome 36 中无法获取。无论如何，该链接没有回答问题。它只是解释了原因。
<input> 的精确值只有数字或者你也想要+ 符号
@Mr.Alien - 我想得到的是用户输入的确切字符串。
如果你真的，真的想让它看起来像一个数字输入，你可能会通过使用没有右边框的普通输入来伪造它，并且数字输入只在它旁边显示箭头，将滚动侦听器附加到普通文本输入，将 onchange 侦听器附加到数字输入，确保在表单输入中切换会跳过第二个输入.....

【解决方案1】：

我想得到的是用户输入的确切字符串。

所以对这里的用户来说最好的事情是input[type=text]，因为当你使用类型号时，它显然会引起问题。

就增量功能而言，我认为它在技术上不适用于您的问题，因为即使用户键入 1+ 并且他尝试增量，+ 也会被数字字段自动。此外，在数字字段中添加除数字之外的任何其他字符也没有任何意义。

如果要验证提交的字符，请使用pattern 属性，您可以自定义验证模式。

【讨论】：