用jquery验证用户名是否有效或重复
最近在做毕业设计的时候,新增管理员用到jquery的ajax验证用户名是否存在,本人初次使用jquery的ajax,发了挺长时间的去网上找相关东西,现在和大家共享我的做法,多多指教。实现的效果如下图:
在代码中使用jquery-1.3.2的vsdoc版本:
1. <script src="/js/jquery/jquery-1.3.2-vsdoc.js" type="text/javascript"></script>
2. <script type="text/javascript" language="javascript">
3. $(function() {
4. $("#txtUserName").focus(function() {
5. $(this).addClass("focus");
6. }).blur(function(){
7. $.ajax({
8. type: "GET",
9. url: "valideUserName_ajax.aspx",
10. dataType: "html",
11. data: "userName=" + $("#txtUserName").val(),
12. beforeSend: function(XMLHttpRequest) {
13. $("#showResult").text("正在查询。。。");
14. },
15. success: function(msg) {
16. $("#showResult").html(msg);
17. $("#showResult").css("color", "red");
18. },
19. complete: function(XMLHttpRequest, textStatus) {
20. //隐藏正在查询图片
21. },
22. error: function() {
23. //错误处理
24. }
25. });
26. });
27. });
28. </script>
其中上面引用的js代码中的就是id为txtUserName的textbox先聚焦,失去焦点时,验证使用ajax判断用户名是否存在。
1. <asp:TextBox ID="txtUserName" size="25" Height="20px" runat="server"></asp:TextBox>
ajax获取的页面:valideUserName_ajax.aspx
前台页面的代码如下:
1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.
3. <html xmlns="http://www.w3.org/1999/xhtml" >
4. <head runat="server">
5. <title>验证用户名是否存在</title>
6. </head>
7. <body>
8. <form id="form1" runat="server">
9. <div>
10.
11. </div>
12. </form>
13. </body>
14. </html>
.cs的代码:本人使用三层架构,如用其他方法,请相应的转换:
1. public partial class valideUserName_ajax : System.Web.UI.Page
2. {
3. protected void Page_Load(object sender, EventArgs e)
4. {
5. if (!string.IsNullOrEmpty(Request.QueryString["userName"]))
6. {
7. if(new zwx.BLL.adminUsers().ExistsUserName(Request.QueryString["userName"].ToString()))
8. {
9. Response.Write("<span class='error'> </span>" + "用户名已经存在,请重新输入。");
10. }
11. else
12. {
13. Response.Write("<span class='success'> </span>" + "恭喜该用户可以使用,请继续。");
14. }
15. }
16. else
17. {
18. Response.Write("<span class='error'> </span>" + "用户名不能为空!");
19. }
20. }
21. }
当完成上面的步骤之后,可以实现判断用户名是否重复,但是新的问题出现了?
1. “/”应用程序中的服务器错误。
2. --------------------------------------------------------------------------------
3.
4. 此页的状态信息无效,可能已损坏。
5. 说明:
补充:web前端 , JavaScript ,