【B/S】系统登录

前言

　　下载了一个登录页面，特别好看，不过它的用户名、密码文本框和登录按钮不是asp控件，而是input标签。如果是asp控件的话，很容易从界面获取到输入的用户名和密码，并在button控件点击事件下写连接数据库的操作。但是都是input标签的话就麻烦一点了。我们需要JavaScript的配合来完成前台到后台的传值。工具：VS、SQL Server、C#。

具体操作

（1）新建一个网站。步骤：打开VS——文件——新建——网站——ASP.NET空网站——确定。
（2）在新建的空网站项目上右击——新建——Web窗体——确定。
（3）下载一个登录页面，链接1、链接2。
（4）具体放置的位置就不多提了，把index里面的代码复制到新建的Default.aspx中，把相应的资源文件放置到新建的文件夹下，具体效果如图1-1所示。

图1-1
（5）在body标签内添加一段JS代码，在js文件夹下添加一个jquery文件（链接）并拖到head标签中，在Default.aspx.cs写一个方法。

<script type="text/javascript">        function test() {            var a = document.getElementById("u").value;            var b = document.getElementById("p").value;            $.ajax({                type: "POST",                url: "Default.aspx/hite",                data: "{a:'" + a + "',b:'" + b + "'}",                contentType: "application/json; charset=utf-8",                dataType: "json",                success: function (result) {                    alert(result.d);                }            });        }</script>

[WebMethod]public static string hite(string a, string b){    string connStr = ConfigurationManager.ConnectionStrings["connStr"].ConnectionString;    SqlConnection conn = new SqlConnection(connStr);    string sql = "select userName,userPassword from UserManager where userName = @uid And userPassword = @pwd";    SqlCommand cmd = new SqlCommand(sql, conn);    SqlParameter[] spa = new SqlParameter[] {         new SqlParameter("@uid",a),        new SqlParameter("@pwd",b)    };    cmd.Parameters.AddRange(spa);    conn.Open();    using (SqlDataReader dr = cmd.ExecuteReader())    {        if (dr.HasRows)        {            return "登录成功！";        }        else        {            return "登录失败！";        }    }}

（6）最后一步，将Default.aspx中登录的input中type属性改为button，添加一个onclieck属性，并赋值test()，即如下所示。

input type="button" value="登 录" style="width:150px;" class="button_blue" onclick="test()"/></div>

（7）界面展示

总结

　　其中，后台连接数据库的配置文件我没写，大家根据自己情况添加。（源代码，VS打开网站，选择文件夹，配置一下连接数据库的信息即可使用）