最近正在研究html5的有关内容,对于html5的强大之处略有窥探,写这篇博客只为记录下一些自己遇到的问题的解决方案,翻遍今后查阅:
1、关于required='required'
在input 标签中加入required='required',当表单提交后,如果内容为空,页面会拒绝提交表单,并且给出空的提示:
当我们在编写html代码的时候就不用手动的写js验证空的问题了
2、关于pattern=""
在input 标签中加入pattern="" 可以通过正则表达式控制输入值的格式,同样也减轻了我们js代码含量,当不符合要求的时候,页面会拒绝提交表单,并且给出提示:
3、提示内容的修改:
不论是做 : required='required' 还是 pattern="" , 网页内置的提示信息并不能满足我们的需求,如果提示的信息能够修改,那该有多好呢?
代码如下:
<script type="text/javascript">
$(function(){
var nameInput = document.getElementById("name")
nameInput.setCustomValidity("用户名不能为空");
});
</script>
</head>
<body>
<form id="sign-in" method="post" >
<input id="name" type="text" name="username" required="required" pattern="" />
<br/><br/><br/><br/>
<input type="submit" value="登录" />
</form>
</body>