Javscript从输入中去掉除正数、逗号和句点以外的所有字符

Question

我有一个type="number"输入字段。在keyup上，我需要去掉除0-9、.和,之外的所有字符(包括-((我不在乎顺序(。事实证明，这非常困难——我还没有找到答案。

我得到了以下信息：

$input.on('keyup change', () => {
$input.val($input.val().replace(/[^0-9,.]/,''));
});

regex来自这个线程(Rails去掉了除数字逗号和小数点之外的所有内容(，但它不起作用——如果我键入1.，输入就会消失。

Answer 1

至少在某些浏览器(Edge(中，type="number"字段值似乎返回了经过净化的值，这意味着您在屏幕上看到的内容可能与javascript看到的内容不同(例如，99.的值将是99(无点((。

此外，这些字段不允许更改光标位置，这意味着如果替换它的值，光标将始终位于末尾。

由于这些限制，也许你最好使用常规的文本输入，并手动清除它，只留下你想要的字符：

test.addEventListener("input", e =>
{
let start = test.selectionStart;
//remove invalid characters
test.value = test.value.replace(/[^0-9,.]/g, (letter, index) =>
{
if (index <= start)
start--;
return "";
})
//remove duplicate , and .
.replace(/([,.])(.*)[,.]/g, (a, b, c, index) =>
{
if (index <= start)
start -= a.length - b.length - c.length;
return b+c;
});
test.selectionStart = test.selectionEnd = start;
});

<input id="test">

Answer 2

考虑使用绝对值。

$(function() {
$("#myNumber").on('keyup change', function(event) {
$(this).val(Math.abs($(this).val()));
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="number" id="myNumber" min="0" />