注册页面的客户端验证.为什么我的blur事件不响应? alert("我是checkUsername");都不会显示出来,按钮焦点消失时不能进验证方法内

wo11201432 2014-08-23 03:22:30

//通过ID获取每个主标签对象
var UserName = $("#<%=UserName.ClientID %>");
var Password = $("#<%=Password.ClientID %>");
var PasswordAgain = $("#<%=PasswordAgain.ClientID %>");
var SchoolSelect = $("#SchoolSelect");
var QQ = $("#<%=QQ.ClientID %>");


//获得图片提示标签的对象
var testnameok = $("#testnameok");
testnameok.hide();
var testnameno = $("#testnameno");
testnameno.hide();

var testqiang = $("#testqiang");
testqiang.hide();
var testruo = $("#testruo");
testruo.hide();

var testPasswordok = $("#testPasswordok");
testPasswordok.hide();
var testPasswordno = $("#testPasswordno");
testPasswordno.hide();

var testQQok = $("#testQQok");
testQQok.hide();
var testQQno = $("#testQQno");
testQQno.hide();




//获得文子提示标签对象
var testshowname = $("#testshowname");
testshowname.hide();

var testshowpassword = $("#testshowpassword");
testshowpassword.hide();

var testshowpwdagain = $("#testshowpwdagain");
testshowpwdagain.hide();

var testshowschol = $("#testshowschol");
testshowschol.hide();

var testQQ = $("#testQQ");
testQQ.hide();






//设置每个对象的onblur事件(对象失去焦点时发生),并调用各自的方法
UserName.blur = checkUsername;

alert(UserName.blur);

Password.blur = checkPassword;
PasswordAgain.blur = checkConfirm;
SchoolSelect.blur = checkSchool;
QQ.blur = checkQQ;



//每个onblur事件的方法,5个方法

//判断用户名是否已存在,并作用户名验证
function checkUsername() {

alert("我是checkUsername");

var username = trim(UserName.val()); //除去前后空格
var usernameRegex = /^[a-zA-Z_]\w{0,9}$/; //用户名格式
if (username == null || username == "") {
testshowname.hide();
testshowname.text("用户名必须填写!").show();
return false;
}
else if (!usernameRegex.test(username)) {
testshowname.hide();
testshowname.text("用户名格式不正确!").show();
return false;
}
else {
$.post("IsHavedUserName.ashx", { "UserName": username }, function (data, status) {
if (status != "success") {
alert("网络链接有误,请稍后再试!");
return false;
} else if (data != "false") {
testnameno.hide(); //隐藏no
testnameok.hide().show(); //先隐藏,后显示
return true;
} else {
testnameok.hide(); //先隐藏ok
testshowname.hide();
testshowname.text("用户名已存在,请另选用户名!").show();
testnameno.hide().show();
return false;
}
});
}
} //判断用户名是否已存在

//判断密码是否正确
function checkPassword() {

alert("我是Password");

var PasswordValue = Password.value;
var passwordRegex = /^\w{6,10}$/;

if (!passwordValue) {
testshowpassword.hide().text("密码不能为空!").show();
testpasswordok.hide(); //先隐藏ok
testpasswordno.hide().show();
return false;
}
else
if (!passwordRegex.test(passwordValue)) {
testshowpassword.hide().text("密码字数在6~10位之间!").show();
testpasswordok.hide(); //先隐藏ok
testpasswordno.hide().show();
return false;
}
else {
testpasswordno.hide();
testpasswordok.hide(); //先隐藏ok
return true;
}

}; //判断密码验证

//两次密码是否一致验证
function checkConfirm() {

alert("我是Confirm");

var confirmValue = PasswordAgain.value;
var passwordValue = Password.value;
if (!confirmValue) {
testshowpwdagain.hide().test("确认密码必须填写!").show();
testqiang.hide();
testruo.hide().show();
return false;
}
else if (confirmValue != passwordValue) {
testshowpwdagain.hide().test("密码必须一致!").show();
testqiang.hide();
testruo.hide().show();
return false;
}
else {
testruo.hide();
testqiang.hide().show();
return true;
}
}

//验证学校是否选择
function checkSchool() {

alert("我是School");


if (!SchoolSelect.val() > 0) {
testshowschol.hide().text("学校必须选择!").show();
return false;
}
}


//验证QQ格式是否正确
function checkQQ() {

alert("我是checkQQ");

var QQValue = QQ.val();
if (QQValue != null || QQValue != "") {
var QQRegex = /^\w{6,20}$/;
if (!QQRegex.test(QQValue)) {
testQQ.hide().text("QQ号格式不正确!").show();
testQQok.hide(); //先隐藏ok
testQQno.hide().show();
return false;
}
} else {
return true;
}
}

//去除用户名前后的空格
function trim(s) {
return s.replace(/^\s+|\s+$/g, "");
}





//获取表单对象,并且为表单提交事件写个方法
var formLogin = $("#formLogin");
formLogin.onsubmit = function () {

alert("我是formLogin");

var bUsername = checkUsername();
var bPassword = checkPassword();
var bConfirm = checkConfirm();
var bQQ = checkQQ();
var bSchool = checkSchool();

//如果,每个上面的每个对象,验证成功,则还回true
return bUsername && bPassword && bConfirm && bQQ && bSchool;
}


});
<body>
<form id="formLogin" runat="server">

<asp:TextBox ID="UserName" name="UserName" type="text" Style="height: 24px;" size="25"
runat="server"></asp:TextBox>
<img id="testnameok" name="testnameok" alt="testok" src="image/ok.gif"/>
<img id="testnameno" name="testnameno" alt="" src="image/no.gif"/>
<span id="testshowname" style="color: #d64554; overflow: hidden; font-weight: bold; font-size: 15px; font-family: 隶书_GB2312;"></span>

<asp:TextBox ID="Password" name="Password" type="password" Style="height: 24px;"
size="25" MaxLength="18 " runat="server"></asp:TextBox>
<img id="testPasswordok" name="testPasswordok" alt="testok" src="image/ok.gif"/>
<img id="testPasswordno" name="testPasswordno" alt="" src="image/no.gif"/>


<span id="testshowpassword" style="color: #d64554; overflow: hidden; font-weight: bold; font-size: 15px; font-family: 隶书_GB2312;"></span>
<asp:TextBox ID="PasswordAgain" name="PasswordAgain" type="password" Style="height: 24px;"
size="25" runat="server"></asp:TextBox>
<img id="testqiang" name="testqiang" alt="" src="image/ok.gif"/>
<img id="testruo" name="testruo" alt="" src="image/no.gif"/>
<span id="testshowpwdagain" style="color: #d64554; overflow: hidden; font-weight: bold; font-size: 15px; font-family: 隶书_GB2312;"></span>

<select id="ProvinceSelect" name="ProvinceSelect">
<option value="0" selected="selected">--请选择省份-- </option>
</select>
<select id="SchoolSelect" name="SchoolSelect">
<option value="0" selected="selected">--请选择学校--</option>
</select>

<span id="testshowschol" style="color: #d64554; overflow: hidden; font-weight: bold; font-size: 15px; font-family: 隶书_GB2312;"></span>


<asp:TextBox ID="QQ" name="QQ" type="text" Style="height: 24px;" size="25" runat="server"></asp:TextBox>
<img id="testQQok" name="testQQok" alt="" src="image/ok.gif"/>
<img id="testQQno" name="testQQno" alt="" src="image/no.gif"/>

<span id="testshowQQ" style="color: #d64554; overflow: hidden; font-weight: bold; font-size: 15px; font-family: 隶书_GB2312;"></span>

<asp:Button ID="btnRegister" runat="server" Text="注册"/>

</html>
[/size]
...全文
337 5 打赏 收藏 举报
写回复
5 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
wo11201432 2014-08-24
谢了!!!还真的有效果了。
  • 打赏
  • 举报
回复
孟子E章 2014-08-23
低版本的jq绑定采用bind
  • 打赏
  • 举报
回复
孟子E章 2014-08-23
另外检查代码的位置、顺序,对象调用时必须已经存在了 另外使用firebug等调试工具检查页面是否出现脚本错误 绑定对象的方法: UserName.on("blur",checkUsername);
  • 打赏
  • 举报
回复
wo11201432 2014-08-23
我没有把js代码放到单独的JS文件里,都是写在.aspx页面上了啊.不知道为什么不进那个blur事件里
  • 打赏
  • 举报
回复
孟子E章 2014-08-23
"#<%=UserName.ClientID %>"这些写法的js只能写在aspx文件中,不能放在js文件中。
  • 打赏
  • 举报
回复
相关推荐
发帖
ASP
加入

2.8w+

社区成员

ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
社区管理员
  • ASP
  • 无·法
申请成为版主
帖子事件
创建了帖子
2014-08-23 03:22
社区公告
暂无公告