我想在放置在表单元素内的rich text editor component (RTE)
中使用input url field
,但它会触发表单验证,从而在其他输入字段中显示"please fill in this field"
。有没有办法将input url field
排除在表单验证之外?
<input type="url" v-model="state.url" no-validation>
或者类似的东西?
我找到了这个问题,但没有答案。
我不知道这是否适用于vue.js,但要从内置的表单验证中排除html输入元素,可以禁用它:
<input type="url" maxlength="42" disabled>
这里我使用了maxlength
,因为它是内置表单验证所使用的标准属性。也许Vue的v-model
的工作方式不同,但我认为这值得一试。
支持性文件
上面对disabled
属性的使用对我来说很有效(具有内置的表单验证,我只在Chrome上测试过它)。但我还没有找到关于MDN的决定性支持文件。
参见:
- 禁用属性:交互
- 客户sode表单验证
我觉得这些文档并不完全清楚。他们暗示使用disabled
属性是一种合法的方法,可以使required
属性被忽略:
因为
disabled
字段的值不能更改,所以required
对同时指定了disabled
属性的输入没有任何影响。此外,由于元素变得不可变,所以在启用控件之前,大多数其他属性(如pattern
)都不会起作用。
但也表示这两个属性不允许一起使用:
注意:在指定了
disabled
属性的输入上不允许使用required
属性。