禁止表单验证

  有些时候，我们指定了表单元素，比如input的type为number类型，或者tel类型，可能我们只是为了在移动端唤出数字键盘，而并不需要做相关的表单验证。这个时候，我们就得去禁止验证。

  这是一个网易前端课中的例子。

<form action="./api" method="post" novalidate>
    <label>电话：<input type="number" name="tel"></label>
    <button>提交</button>    
</form>

  方案一是如上所示，我们通过给form添加novalidate属性，来禁用表单验证。

The novalidate and formnovalidate content attributes are boolean attributes. If present, they indicate that the form is not to be validated during submission.

The no-validate state of an element is true if the element is a submit button and the element's formnovalidate attribute is present, or if the element's form owner's novalidate attribute is present, and false otherwise.

   引用链接地址w3.org 翻译过来就是： novalidate和formnovalidate这两个属性是布尔值。如果这两个值存在的话，就表示该表单在提交的时候并不会验证。如果元素是一个提交按钮（submit 类型的 input 或 button）并且该按钮元素存在formnovalidate属性，那么该按钮元素并不会验证。或者如果该元素的父元素form的 novalidate属性存在。那么也不会验证。但是有一个问题是，我们在form上添加novalidate属性，就会使整个表单禁止验证。如果我们只想禁止某一个元素进行验证的话，就不能使用这个方法了。

   我们可以使用如下所示的第二种方法，即借助javascript的blur和focus事件去骗过该表单元素的验证。即失焦的时候设为只读属性，

  方法二：

<form action="./api" method="post">
    <label>电话：<input type="number" name="tel"></label>
    <button>提交</button>    
</form>

var tel = document.forms[0].elements['tel'];
tel.addEventListener("blur", function(e){e.target.readOnly = true;})
tel.addEventListener("focus",function(e){e.target.readOnly = false;})