html5 表单验证

<!--
壹丶
<form action="#" name="EduTypeForm" id="EduTypeForm" method="post">
<ul>
<li>
test:&nbsp&nbsp&nbsp <input id="num" type="text">
</li>
<li>
<a class="btn btn-mini btn-primary" onclick="save();">保存</a>
<a class="btn btn-mini btn-danger" onclick="top.Dialog.close();">取消</a>
</li>
</ul>
</form>

<script type="text/javascript">
function save(){
var nums=document.getElementById("num");
if(nums.value==''){
nums.setCustomValidity("空!");
}else{
nums.setCustomValidity('');
}
/* if(!nums.checkValidity()){ 判断我们输入的值是否异常 Boolean类型
return false;
} */
}
</script> -->

<!--
贰丶
<form>
<input id="text" pattern="^1[3-9]\d{9}$" required />
<input id="button" type="submit" />
</form>

<script>
text.oninput=function(){
text.setCustomValidity("");
};
text.oninvalid=function(){
text.setCustomValidity("您输入的手机号有误!");
};
</script> -->


<!--
叁丶
<form name="test" action="." method="post">
<input type="text" required pattern="^\d{4}$" oninput="out(this)" placeholder="请输入代码" >
<button type="submit">Check</button>
</form>

<script type="text/javascript">
function out(i){
var v = i.validity;
if(true === v.valueMessing){
i.setCustomValidity("请填写些字段");
}else{
if(true === v.patternMismatch){
i.setCustomValidity("请输入4位数字的代码");
}else{
i.setCustomValidity("");
}
}
}
</script> -->

posted @ 2017-02-09 14:27  小新na  阅读(280)  评论(0编辑  收藏  举报