html5表单验证pattern属性修改提示信息

例子

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>html5表单验证pattern属性修改提示信息</title>
<script type="text/javascript">
function validateIt(inputelement){
  if(inputelement.validity.patternMismatch){
    inputelement.setCustomValidity('只允许输入字母');
  }else{
    inputelement.setCustomValidity(''); //输入内容符合验证条件
  }
  return true;
}
</script>
</head>
<body>
<form name="form1">
  <input type="text" name="username" pattern="[a-zA-Z]+" required oninvalid="validateIt(this)" oninput="validateIt(this)"/>
  <input type="submit" />
</form>
</body>
</html>

分类:   前端笔记  /   /  浏览量:  4689
2015-12-26 19:52 Saturday