Question

我有HTML表格。我已针对每个输入字段添加了required标记，我需要将其填充。我在AngularJS中使用$<form-name>.<input.field.name>.$error来检查提交期间的错误，并将错误类应用于这些字段。

有没有办法阻止HTML5验证弹出窗口同时保留required属性？

Answer 1

您需要novalidate属性。

<form novalidate>
    ...
</form>

Form's novalidate attribute on MDN

Answer 2

您可以在角度js的脏条件中显示错误消息，而不是在提交时。试试这样：

＆＃13;

<span style="color:red" ng-show="$<form-name>.<input.field.name>.$dirty && $<form-name>.<input.field.name>.$invalid">
    <span ng-show="$<form-name>.<input.field.name>.$error.required">Name is required.</span>
</span>

＆＃13;

这将仅在焦点出现时显示错误消息。在提交时，将显示默认的HTML5必填字段错误消息。

Answer 3

您必须将novalidate放在表单元素上：

<form novalidate>
    <input type="text" required>
    <button type="submit">Save</button>
</form>

如何覆盖HTML5验证弹出？

3 个答案: