前端js 输入框限制（只能输入数字，10位小数，除0[0-9]、.、--、-0[0-9]、-.不能开头外，其他的都可以）？

JavaScript026

前端js 输入框限制（只能输入数字，10位小数，除0[0-9]、.、--、-0[0-9]、-.不能开头外，其他的都可以）？,第1张

可以使用如下正则表达式来限制输入框的输入内容：

/^(?!0\d|\.-|\.\.|-0\d|-)(?!.*\.\..*)(?!.*--.*)(?!.*-$)([1-9][0-9]*|0)(\.[0-9]{0,10})?$/

该正则表达式的解释如下：

^：匹配输入的字符串开头。

(?!0\d|\.-|\.\.|-0\d|-)：负向先行断言，表示输入的字符串不能以 0 开头、.-、..、-0 开头或 - 结尾。

(?!.*\.\..*)(?!.*--.*)：负向先行断言，表示输入的字符串不能包含两个及以上的连续 . 或 --。

(?!.*-$)：负向先行断言，表示输入的字符串不能以 - 结尾。

([1-9][0-9]*|0)：表示输入的字符串必须为数字，可以以 0 或者 1-9 开头，后面跟着 0 个或多个数字。

(\.[0-9]{0,10})?：表示输入的字符串可以包含小数点和最多 10 位小数。

$：匹配输入的字符串结尾。

可以将该正则表达式应用到输入框的 oninput 或 onkeydown 事件中，以便实时验证用户输入的内容，并在输入不符合要求时阻止输入。例如：

const input = document.querySelector('#myInput')

input.addEventListener('input', (event) =>{

const value = event.target.value

const isValid = /^(?!0\d|\.-|\.\.|-0\d|-)(?!.*\.\..*)(?!.*--.*)(?!.*-$)([1-9][0-9]*|0)(\.[0-9]{0,10})?$/.test(value)

if (!isValid) {

event.target.value = value.slice(0, -1)// 阻止输入

}

})

在这个例子中，我们首先获取了一个 id 为 myInput 的输入框，并添加了一个 input 事件监听器。在事件处理程序中，我们获取了输入框的值，并使用正则表达式对其进行验证。如果验证失败，我们阻止输入，即将输入框的值设为原来的值减去最后一位。这样，就能够实现对输入框的限制。

限制文本框只能输入正数，负数，小数 onkeyup="value=value.replace(/[^\-?\d.]/g,'')" 限制文本框只能输入正数，小数 onkeyup="value=value.replace(/[^\d.]/g,'')"

只能输入或粘贴纯数字的：

<input onkeyup="value=value.replace(/[^\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">

页面输入框js正则验证输入值为数字，且只保留小数点后两位：

<input type="text" id="aaa" name="aaa" onkeyup="clearNoNum(this)" onblur="clearNoNum(this)"/>

function clearNoNum(obj)

{

//先把非数字的都替换掉，除了数字和.

obj.value = obj.value.replace(/[^\d.]/g,"")

//保证只有出现一个.而没有多个.

obj.value = obj.value.replace(/\.{2,}/g,".")

//必须保证第一个为数字而不是.

obj.value = obj.value.replace(/^\./g,"")

//保证.只出现一次，而不能出现两次以上

obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".")

//只能输入两个小数

obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')

}