在HTML5表单验证,自定义规则,用checkValidity()结合setCustomValidity()实现

自定义校验规则:

在HTML5表单验证API中,自定义规则通常通过监听表单元素的事件(如 input、change 或 invalid)并在JavaScript中进行验证来实现。以下是一个简单的例子,展示了如何创建一个自定义的验证规则,该规则要求输入字段必须包含至少两个连续的大写字母:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Custom Form Validation</title>
</head>
<body>
    <form id="myForm">
        <label for="customInput">请输入至少含两个连续大写字母的字符串:</label>
        <input type="text" id="customInput" required>
        <button type="submit">提交</button>
    </form>

    

相关推荐

  1. 【element】常 El-Form 定义校验规则实战

    2024-03-17 23:12:01       36 阅读
  2. 【PHP】TP5验证规则定义

    2024-03-17 23:12:01       67 阅读
  3. Angular定义异步验证

    2024-03-17 23:12:01       33 阅读
  4. css中如何实现验证效果

    2024-03-17 23:12:01       64 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-17 23:12:01       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-17 23:12:01       106 阅读
  3. 在Django里面运行非项目文件

    2024-03-17 23:12:01       87 阅读
  4. Python语言-面向对象

    2024-03-17 23:12:01       96 阅读

热门阅读

  1. C#+datax实现定时增量同步

    2024-03-17 23:12:01       51 阅读
  2. Git的一些基础命令

    2024-03-17 23:12:01       50 阅读
  3. DELETE、TRUNCATE 和 DROP 在MySQL中的区别及使用示例

    2024-03-17 23:12:01       40 阅读
  4. 【leetcode热题】比较版本号

    2024-03-17 23:12:01       41 阅读
  5. C#--StreamWriter和StreamReader对象及常用函数

    2024-03-17 23:12:01       39 阅读
  6. 【记录 | 字符串、搜索】单词接龙

    2024-03-17 23:12:01       42 阅读
  7. DDR3 APP接口代码

    2024-03-17 23:12:01       38 阅读
  8. AIGC赋能,天猫精灵、华米科技“抢跑”智能穿戴

    2024-03-17 23:12:01       40 阅读
  9. C语言经典面试题目(七)

    2024-03-17 23:12:01       41 阅读
  10. UDP协议

    UDP协议

    2024-03-17 23:12:01      43 阅读
  11. C语言如何引⽤⼆维数组元素?

    2024-03-17 23:12:01       47 阅读
  12. 24计算机考研调剂 | 南昌航空大学

    2024-03-17 23:12:01       45 阅读
  13. 什么是区块链,如何学习区块链

    2024-03-17 23:12:01       42 阅读
  14. 线程的通俗解释

    2024-03-17 23:12:01       43 阅读