jquery实现表单验证与页面加载之后执行渲染

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.error{
color: red;
}
</style>
</head>
<body> <form id="f1" action="s5.html" method="POST">
<div><input name="n1" tex = "用户名" type="text" /></div>
<div><input name="n2" tex = "密码" type="password" /></div>
<div><input name="n3" tex = "邮箱" type="text" /></div>
<div><input name="n4" tex = "端口" type="text" /></div>
<div><input name="n5" tex = "IP" type="text" /></div> <input type="submit" value="提交" />
<!--有时候网络速度慢,图片加载慢,所以会先加载图片框然后就开始绑定事件-->
<!--<img src="...">-->
</form>
<script src="jquery.js"></script>
<script>
// 当页面框架加载完毕后,自动执行
$(function(){
$.Login('#f1')
}); $(function(){
// 当页面所有元素完全加载完毕后,执行
$(':submit').click(function () {
$('.error').remove();
var flag = true;
$('#f1').find('input[type="text"],input[type="password"]').each(function () {
var v = $(this).val();
var n = $(this).attr('tex');
if(v.length <= 0){
flag = false;
var tag = document.createElement('span');
tag.className = "error";
tag.innerHTML = n + "必填";
$(this).after(tag);
// return false;
}
});
return flag; }); }); // $(':submit').click(function () {
// var v = $(this).prev().val();
// if(v.length > 0){
// return true;
// }else{
// alert('请输入内容');
// return false
// }
// }) </script>
</body>
</html>

  

上一篇:linux 木马清理过程


下一篇:SQLite 附加数据库(http://www.w3cschool.cc/sqlite/sqlite-attach-database.html)