html - 我是否在 html5 中创建自定义验证？

Question

我的表单中有多个字段，例如

<input type="text" pattern="[0-9]+([\.,][0-9]+)?" step="any" oninvalid="setCustomValidity('Enter decimal value')" required>

我可以创建像必需的前十进制这样的东西，这样我就不必每次都写模式和自定义消息

我是第一次使用 html 5，所以如果您需要更清楚地了解问题，请帮助我，让我知道谢谢

Answer 1

你可以做这样的事情，

• 如果您有许多具有相同模式的字段，您可以为所有这些字段提供相同的类名称，或者为所有这些字段提供相同的名称，
• 为了一起识别所有这些类型的字段，有必要执行上述操作，例如，

HTML 代码：

<input type="text" step="any" class="patternText" oninvalid="setCustomValidity('Enter decimal value')" required>

JS代码：

var patternFields=document.getElementByClassName("patternText");
for(var i=0;i<patternFields.length;i++)
{
patternFields.pattern="[0-9]+([\.,][0-9]+)?";
patternFields.oninvalid = function(event) {
event.target.setCustomValidity('Username should only contain lowercase letters. e.g. john');
}
}

Answer 2

基于此处的示例：

$.validator.addMethod('Decimal', function(value, element) {

return this.optional(element) || /^\d+(\.\d{0,3})?$/.test(value); 

}, "请输入正确的数字，格式为xxxx.xxx");