创建出色的表单

https://developers.google.cn/web/fundamentals/design-and-ux/input/forms/

Constraint Validation API https://dev.w3.org/html5/spec-preview/constraints.html#constraint-validation

Constraint Validation API(MDN) https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5/Constraint_validation

<body>
  <!--[if lt IE 8]>  <h3>请升级你的浏览器，或更换主浏览器！！!</h3>  <![endif]-->
  <form>
      <input id=text1 type=text required minlength=10 />
      <input id=submit1 type=submit>
  </form>
  <script>
      document.querySelector('#submit1')
      .addEventListener('click',function(){
          var text1 = document.querySelector('#text1');
          console.log( text1.validationMessage);
          if( text1.checkValidity() ){
            text1.setCustomValidity('good')
          }else{
            text1.setCustomValidity('')
          }
      },false);
  </script>
</body>
posted @ 2018-02-02 13:30  Ajanuw  阅读(165)  评论(0)  编辑  收藏  举报