温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

如何约束验证DOM

发布时间:2022-03-25 10:58:25 来源:亿速云 阅读:137 作者:iii 栏目:web开发

本文小编为大家详细介绍“如何约束验证DOM”,内容详细,步骤清晰,细节处理妥当,希望这篇“如何约束验证DOM”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

  约束验证 DOM 方法

  checkValidity():如果 input 元素中的数据是合法的返回 true,否则返回 false。

  setCustomValidity()

  设置 input 元素的 validationMessage 属性,用于自定义错误提示信息的方法。

  使用 setCustomValidity 设置了自定义提示后,validity.customError 就会变成true,则 checkValidity 总是会返回false。如果要重新判断需要取消自定义提示,方式如下:

  setCustomValidity('')

  setCustomValidity(null)

  setCustomValidity(undefined)

  以下实例如果输入信息不合法,则返回错误信息:

  checkValidity() 方法

  <input id="id1" type="number" min="100" max="300" required>

  <button onclick="myFunction()">验证</button>

  <p id="demo"></p>

  <script>

  function myFunction() {

  var inpObj = document.getElementById("id1");

  if (inpObj.checkValidity() == false) {

  document.getElementById("demo").innerHTML = inpObj.validationMessage;

  }

  }

  </script>

读到这里,这篇“如何约束验证DOM”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

dom
AI