Javascript 如何实现正则表达式以对更改事件作出反应？

我正在创建表单验证，其中一个输入是

type='text'

，但我需要允许用户只在其中写入0-9之间的数字和最大数字长度9。在输入值传递到状态之前，我可以传递任何正则表达式来消除输入值中的字母吗

const handleChangeData = ({currentTarget}, key) => {
let val = currentTarget.value;

if (currentTarget.name === 'phone') {
      const regex = /d+/;
      val.match(regex);
      changeData(prevState => {
        return {...prevState, [key]: val};
      });
    }
// ... more code here
}

我不想使用

type=number

，也不能使用

patters

，因为我有自己的错误弹出窗口

html:

{errors.phone&&(
{errors.phone}
)}
handleChangeData（即“电话”）}
type=“text”
占位符=“电话号码”
/>

您必须处理

onKeyPress

事件

使用下面的代码来处理验证

const validateNumber = (evt, regex) => {
    var theEvent = evt || window.event;
    if (!regex.test(key)) {
        theEvent.returnValue = false;
        if (theEvent.preventDefault) theEvent.preventDefault();
    }
}

调用

input

元素的上述方法

onKeyPress

onKeyPress = (e) => { validateNumber(e, /[0-9]|\./) }

希望这对你有用

const handlePhoneChange=（{currentTarget，key，keyCode}）=>{
//因为这会在每个键上触发，所以我们只需要检查
//如果按下的键是数字。
//我们可以在值上使用regexp。
//或者检查一下钥匙
//或者检查钥匙代码
//1）RegExp
//我们测试在值的开始和结束之间，有1到9个数字
const is_valid=/^\d{1,9}$/.test（currentTarget.value）；
//2）钥匙
//常量有效=[0123456789]。包括（键）和¤tTarget.value.length=96和&keyCode{
const state=reducer（）；
document.querySelector（“#phone”）.value=state.phone；
}；

---

我真的不明白你的代码。你用正则表达式覆盖

val

，而不是将正则表达式应用于

val

并检查结果是否有效？有效时应将状态设置为什么？无效时应设置为什么？因为如前所述，你将state属性

phone

的新值设置为正则表达式

>/（d+/

。用regex为您编辑的代码我想阻止写字母，只需要在state中放入数字不是所有的代码，但reg.test（）几乎对我有效，regex应该是/^\d+$/；谢谢！你的意思是说按键对你无效。我不是说那不起作用，看看我的html，看看我有什么结构

onKeyPress = (e) => { validateNumber(e, /[0-9]|\./) }