Question

我想使用数字类型输入字段，但如果输入了美元符号，则会删除美元符号（对于不是Chrome的浏览器）。

但是使用下面的代码，如果我输入300或300等，它会清除我的所有条目。

发生了什么？

＆＃13;

jQuery( 'input' ).keyup( function( ) {
  this.value = this.value.replace(/\$/g, '*');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number">

＆＃13;

Answer 1

浏览器不允许您将输入值设置为无效字符串。字符串100,对于输入类型编号无效。 Please see the W3 documentation

Answer 2

你的代码的表现方式不是因为你的正则表达式，而是因为＆＃34;数字＆＃34;当输入不是有效数字时，输入为空字符串。

因此，您输入1 ... 2 ... 3，一切正常。但是如果你点击,，表达式

this.value

突然变成空字符串。 .replace()电话实际上没有做任何事情，但您将结果重新分配回this.value，以便将其删除。

因此，您可以在代码中添加测试：

jQuery( 'input' ).keyup( function( ) {
  if (this.value.length)
    this.value = this.value.replace(/\$/g, '*');
});

然而，这对你没有任何好处，因为如果一个人输入$，你就会找回空字符串而你无法修复它。你无法区分一个＆＃34;数字＆＃34;之间的JavaScript差异。输入真的为空，并且其中包含浏览器不认为的文本的文本是一个很好的数字。

Answer 3

这是因为，当您设置value时，会调用value sanitization algorithm。对于number inputs，

值清理算法如下：如果值为 element不是有效的浮点数，然后将其设置为空而不是字符串。

由于300,不是有效数字，因此输入将被清除。

然后，更好的方法是阻止它们被写入，而不是替换字符：

＆＃13;

jQuery('input').keydown(function(e) {
  if(e.key == '$' || e.which == 52 || e.keyCode == 52) e.preventDefault();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number">

＆＃13;