前端处理input框只能输入带小数点的数字

 input框限制输入数字带小数点，可以输入千分号，不能以小数点开头，不能同时带有几个小数点，代码如下：

<input oninput = "ediform.value = validateNum(ediform.val)"></input>

const validateNum = (val:any) =>{

return val.replace(/[^\d.,]/g, '')

.replace(/^\./g, '') 

.replace('.', '$#$') 

.replace(/\./g, '')

.replace('$#$', '.')

}

 解析：

1. val.replace(/[^\d.,]/g, '')

这个正则表达式的作用是移除字符串 val 中所有不是数字 (\d)、逗号（,）或点（.）的字符。即，删除所有非数字、非逗号、非小数点的字符。

• 例如，如果 val = '1abc2,3.4$'，经过这一步后，val 会变成 '123.4'。

2. val.replace(/^\./g, '')

这个正则表达式的作用是删除字符串 val 开头的点（.）。这样做是为了避免如果用户输入的字符串以 . 开头，它将被移除。

• 例如，如果 val = '.123.45'，这一步后会变成 '123.45'。

3. val.replace('.', '$#$')

这个操作将字符串中的第一个点（.）替换为特殊符号 '$#$'。这是因为下一步操作需要处理字符串中的其他点（.）。

• 例如，如果 val = '123.45'，它会变成 '123$#\$45'。

4. val.replace(/\./g, '')

这一步将字符串中所有的点（.）删除。此时，已经替换掉第一个点的地方是 '$#$'，因此其他的点（.）将被移除。

• 例如，如果 val = '123$#\$45'，它会变成 '12345'。

5. val.replace('$#$', '.')

最后，这一步将 '$#$' 替换回一个点（.），即将之前替换掉的第一个点恢复。

• 例如，如果 val = '12345'，它会变成 '123.45'。