登录页面,ajax,layer

demo.html









    
   
    仿百度登录界面
   
   
   
   
   


    Hello World!
   


   

       
       
       
   




demo.css


*{
    padding:0px;
    margin:0px;
    font-family:"微软雅黑";
}


 #header{
     width:100%;
     height:40px;
     background-color:#000;
 }


 #header-con{
     width:100%;
     height:40px;
     border:solid 1px red;
     margin:0px auto;
 }


 #header-con div{
     float:right;
     line-height:40px;
 }


 #header-con div a{
     color:#00ff21;
 }


 .login-item input{
     width:350px;
     height:40px;


 }


.login-item a{
    background-color:#ff6a00;
    width:350px;
    height:50px;
    display:block;
    text-align:center;
    line-height:50px;
    color:#fff;
    font-size:20px;
}
.login-item{
    margin-top:25px;
    margin-left:30px;
}


#loginbox{
    display:none;
}

demo.js


///
///
function showLoginBox() {
    layer.open({
        type: 1,
        title: "登录",
        area: ["395px", "300px"],
        content: $("#loginbox")
    });
}


function login() {
    var username = $.trim($("#txtUserName").val());//获取用户名
    var pwd = $.trim($("#txtPwd").val());
    if(username==""||pwd=="")
    {
        layer.alert("用户名不能为空或密码不能为空",
         {
           title:"提示",
           icon:5
         });
    }
    else
    {
        //C#
        $.post("/control-background.ashx", {
            "username": username, "pwd": pwd
        }, function (data) {
            if(data=="OK")
            {
                 //layer.alert("登录成功", { title: "提示", icon: 6 });
                
                //window.location.href="/jumpTo.html";
                alert("OK");
                window.location.href="/jumpTo.html";
               
            }
            else
            {
                layer.alert("用户名密码不正确",
             {
             title: "提示",
             icon: 5
              });
            }
        });
    }
    
}
function text() {
    
}


demo.ashx.cs


using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Linq;
using System.Web;


namespace Project20160406
{
    ///


    /// Summary description for control_background
    ///

    public class control_background : IHttpHandler
    {
        private string conStr;
        protected SqlConnection conn;
        string con=ConfigurationManager.ConnectionStrings["con"].ToString();
        
        
        public void ProcessRequest(HttpContext context)
        {
            //context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");
            conStr=con; // 从web 中得到连接地址


            using(conn=new SqlConnection(conStr))
            {
                var username = context.Request.Form["username"];
                var pwd = context.Request.Form["pwd"];
                string strSql = string.Format("SELECT UserID FROM Table_1 WHERE UserName='{0}' and UserPwd='{1}'", username, pwd);
                conn.Open();
                SqlCommand cmd = new SqlCommand(strSql, conn);
                SqlDataReader reader=cmd.ExecuteReader();
                try
                {
                    if (reader.HasRows)
                    {
                        context.Response.Write("OK");
                        
                    }
                    else
                    {
                        context.Response.Write("NotOK");
                    }
                }
                catch(Exception e)
                {
                    context.Response.Write("暂时无法登录");
                }
               
                finally
                {
                     conn.Close();
                }
               
            }


            
        }


        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}


web.config





 
   
   
 

 
   
   
 


你可能感兴趣的:(C#)