各位亲帮忙看上这段JQUERY的表单验证代码
日期：2014-05-16 浏览次数：20405 次
各位亲帮忙看下这段JQUERY的表单验证代码
因为是初学，照着教程做了几次，不停的修改始终不得要领，我觉得是我思路不对，请各位指点指点小弟！
------解决方案--------------------
楼主，看了你的代码，我觉得：唉
1.<script>标签最好放在<head></head>之间
2.if(regname.test(this)=true)//不能给函数返回值赋值
3.<p><label for="1">两个标签没有任何意义
4.<label>与input id重复且取名极不规范
5.onclick=document.formName.submit()，你用的是图片按钮，点击的话默认提交表单
你把onclick绑定提交事件完全没有必要
我根据你的需求把你用户名的判断的代码改进了一下，点击输入框就会触发对应函数
因为是初学，照着教程做了几次，不停的修改始终不得要领，我觉得是我思路不对，请各位指点指点小弟！
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>新用户注册</title>
<link rel="stylesheet" type="text/css" href="../CSS/style.css">
</head>
<body>
<div class="regist_step1"></div>
<script type="text/javascript">
var regname=/^[\w]+$/g;
$(document).ready(function(){
$("#1").blur(function()
{if(regname.test(this)=true)
{
$("#1tip").html("输入正确");
}
else
{$("#1").focus();
$("#1tip").html("用户名不能为空，\n且只能为2-16个数字或英文以及下划线组成的字符");
return false;}
;}
)
})
</script>
<form class="regist_2" action="registra.php" method="post" name="reg_1" enctype="multipart/form-data">
<p><label for="1">用户名：</label><input type="text" class="regist_1" name="user_name" id="1"/></p>
<p><label for="2">登录密码：</label><input type="password" class="regist_1" name="user_password" id="2"/></p>
<p><label for="3">确认密码：</label><input type="password" class="regist_1" name="confermare_psw" id="3"/></p>
<p><label for="4"> 验证码：</label><input type="text" class="regist_1" name="Verfy" id="4"/></p>
<p><label for="5"> 我已阅读并同意<a href="guize.php" target="_blank">《用户使用规则》</a></label><input type="checkbox" name="comferma_rule" id="5"/></p>
<input type="image" src="../icon/btn3.gif" onclick="document.formName.submit()"/>
</form>
<span id="1tip" class="err"></span>
<img src="Verify.php" class="verify">
</body>
------解决方案--------------------
楼主，看了你的代码，我觉得：唉
1.<script>标签最好放在<head></head>之间
2.if(regname.test(this)=true)//不能给函数返回值赋值
3.<p><label for="1">两个标签没有任何意义
4.<label>与input id重复且取名极不规范
5.onclick=document.formName.submit()，你用的是图片按钮，点击的话默认提交表单
你把onclick绑定提交事件完全没有必要
我根据你的需求把你用户名的判断的代码改进了一下，点击输入框就会触发对应函数
<style type="text/css">
#div1{
width:200px;
margin-top:-20px;
margin-left:250px;
}
</style>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
$("#div1").hide();
//var a=$("#1").val();
var patrn=/^[A-Za-z][A-Za-z0-9_]{2,16}$/;
$("#1").focus(function(){
//alert($("#1").val());
if($("#1").val()==""){
$("#div1").show().css("background-color","#00FFFF").html("请输入用户名!");
return false;
}
});
$("#1").blur(function(){
//alert($("#1").val());
if (!patrn.test($("#1").val())){
$("#div1").show().css("background-color","#FF0000").html("用户名格式不正确");
return false;
}else{
$("#div1").show().css("background-color","#00FF00").html("输入正确");
}
});
})
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
