javascript - 修改表单元素所需的内容

Question

我想在提交表单之前设置更多条件，使用表单字段的 html 'required' 属性。有没有办法可以手动拦截/更改它检查的条件？就我而言，我希望要求一个字段是数组中的值。

Answer 1

这是一个有点漫长的过程，但非常有用。 您可以在 form 中的任何 input 标记上添加 onchange 事件，

<input type="text" className="form-control" onChange={(event) => this.handleUserInput(event)} name="fname"/>


handleUserInput(e) {
    const name = e.target.name;
    const value = e.target.value;
    this.setState({[name]: value}, 
            () => { this.validateField(name, value) });
} 



validateField(fieldName, value) {
    let fnameValid = this.state.fnameValid;
    switch(fieldName) {
      case 'fname':
         fnameValid = value!=="" && /^([a-zA-Z]+)$/.test(value) && value.length >= 2; //here you can check as many condition as you want using `&&` operator.
        break;
      case 'more input name here':
       ... // More input validation
        break;
      default:
        break;
    }
  }

Ref