使用虚拟模式故意使 html5 表单验证器无效答案

【问题标题】：Purposely invalidate the html5 form validator using dummy pattern使用虚拟模式故意使 html5 表单验证器无效
【发布时间】：2018-03-13 14:38:21
【问题描述】：

如果满足特定条件，我想以编程方式将输入设置为无效，例如

<input type="text" required />

让我们以变量 isValid 为例，如果它是 false，我希望该气泡显示为默认浏览器气泡 (onsubmit) 和提供的自定义错误。所以要添加自定义错误，我想出了解决方案

<input 
    type="text" 
    required 
    oninvalid="this.setCustomValidity('Please Enter valid name')"
    oninput="setCustomValidity('')" 
/>

但是，这仅检查它是否为空，额外的验证来自一个名为 pattern 的字段，但是那个正则表达式，所以我想可能在 'isValid == true' 时做一个几乎所有大小写的正则表达式，否则一个正则表达式每次都会掉下来，例如（反应）

<input 
    type="text" 
    required
    pattern={isValid ? 'regex valid always' : 'regex fail always'}
    ...
/>

这能行吗？有没有更好的方法我没有看到？

【问题讨论】：

【解决方案1】：

感谢@revo 的帮助，让它得以正常工作：

<input 
    type="text" 
    required
    pattern={isValid ? null : '(?!)'}
    ...
/>

【讨论】：