华域联盟 .Net asp.net+jquery ajax无刷新登录的实现方法

asp.net+jquery ajax无刷新登录的实现方法

因为工作需要研究了一下 js的ajax,下面是成果。

主要是三部分:

一、js部分 友情提示注意js部分中的 $("#btn_login")中的return false;这个可以阻止回转服务器不然还是会刷新

复制代码 代码如下:

$(document).ready(function () {

    $("#btn_login").click(function () {

        postlogin();

        return false;

    });

});

function postlogin() {

    if (checkUserName() && checkUserPwd()) {

        var username = $('#txt_loginname').val();

        var userpass = $('#txt_loginpass').val();

        $.post("../UserLogin.aspx", { UserName: username, UserPass: userpass }, function (result) {

            if (result == "1") {

                alert("登录成功!");

            } else if (result == "3") {

                alert("用户名不正确!");

            } else if (result == "2") {

                alert("密码不正确!");

            } else {

                alert("登录失败!请重试!" + result);

            }

        });

    }

}

function checkUserName() {

    if ($("#txt_loginname").val().length == 0) {

        alert('用户名不能为空!');

        return false;

    } else {

        return true;

    }

}

function checkUserPwd() {

    if ($("#txt_loginpass").val().lenght == 0) {

        alert('密码不正确!');

        return false;

    } else {

        return true;

    }

}

二、页面部分

复制代码 代码如下:

<table width="100%" border="0" cellspacing="0" cellpadding="0">

          <tr>

            <td width="32%" height="37" valign="middle">用户名:</td>

            <td width="68%" valign="middle">

                <input type="text" name="txt_loginname" id="txt_loginname" class="input_1"/>

            </td>

          </tr>

          <tr>

            <td height="37" valign="middle">密 码:</td>

            <td valign="middle">

            <input type="password" name="txt_loginpass" id="txt_loginpass" class="input_2"/>

            </td>

          </tr>

          <!--<tr>

            <td height="37" valign="middle">验证码:</td>

            <td valign="middle">

              <input type="text" name="textfield3" id="textfield3" class="input_3" style="float:left"/>

              <span style="float:left; margin-left:6px;"><img src="images/img_7.gif" /></span></td>

          </tr>-->

          <tr>

            <td colspan="2">

              <input type="image" name="btn_login" id="btn_login" src="images/img_4.gif" />

              <input type="image" name="input" src="images/img_5.gif" />

               <input type="image" name="input" src="images/img_6.gif" />

            </td>

          </tr>

        </table>

三、后台部分也就是在js中转向的处理登录信息的页面

复制代码 代码如下:

protected void Page_Load(object sender, EventArgs e)

        {

            string username = Request.Form["UserName"];

            string userpass = Request.Form["UserPass"];

            T_User user = UserManager.loginpassword(username, userpass);

            if (user != null)

            {

                Session["user"] = user;

                Response.Write("1");  //登录成功

                Response.End();

            }

            else

            {

                if (UserManager.OnlyOne(username) >= 1)

                {

                    Response.Write("2");  //密码不正确

                    Response.End();

                }

                else

                {

                    Response.Write("3");  //用户名不存在

                    Response.End();

                }

            }

        }

您可能感兴趣的文章:

  • jQuery Ajax 实现在html页面实时显示用户登录状态
  • jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
  • jQuery+AJAX实现遮罩层登录验证界面(附源码)
  • JQuery+Ajax+Struts2+Hibernate框架整合实现完整的登录注册
  • PHP+jQuery+Ajax实现用户登录与退出
  • S2SH整合JQuery+Ajax实现登录验证功能实现代码
  • div弹出层的ajax登录(Jquery版+c#)
  • 基于jquery ajax 用户无刷新登录方法详解
  • jQuery.ajax 用户登录验证代码
  • jQuery+Ajax用户登录功能的实现
  • jquery ajax 登录验证实现代码
  • jQuery基于ajax实现页面加载后检查用户登录状态的方法

本文由 华域联盟 原创撰写:华域联盟 » asp.net+jquery ajax无刷新登录的实现方法

转载请保留出处和原文链接:https://www.cnhackhy.com/50833.htm

本文来自网络,不代表华域联盟立场,转载请注明出处。

作者: sterben

发表回复

联系我们

联系我们

2551209778

在线咨询: QQ交谈

邮箱: [email protected]

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部