一:登录页面.html

制作登录页面html后缀,是客户端控件,不能直接和后台交互,而服务端aspx可以和后台交互,所以要通过js获得内容,通过aspx和后台交互

前台:

<body>
    <table>
        <tr><td>用户名:</td><td><input type="text" id="txtUserName" /></td></tr>
        <tr><td>密码:</td><td><input type="password" id="txtPwd" /></td></tr>
        <tr><td><input type="button" id="btnLogin"  value="登录"/></td></tr>
    </table>
</body>

在js中

$(function () {
    $("#btnLogin").click(function () {
        var username = $.trim($("#txtUserName").val());
        var pwd = $.trim($("#txtPwd").val());
        if (username == "" || pwd == "") {
            alert("用户名或密码不能为空");
        }
        else {  //放ajax
            $.post("/ajax/LoginAjax.ashx?cmd=login", { "username": username, "pwd": pwd }, function (data) {     //json格式
                var data = eval('(' + data + ')');//吧json转成js数组
                if (data.Success) {
                    alert(data.Infor);
                }
                else {
                    alert(data.Infor);
                }

//////alert(data)               //这是一种数据返回方式字符串格式(弹出返回的所有数据),服务端一般返回的是json格式
            });
        }
    });

一般应用程序ashx中

Dictionary<string, object> dt = new Dictionary<string, object>();     //字典集合 key存string value存object格式

JavaScriptSerializer jss = new JavaScriptSerializer();                         //把dt转换为json格式

①public void ProcessRequest(HttpContext context)

{

string username = context.Request.Form["username"].ToString();
            string pwd = context.Request.Form["pwd"].ToString();
            string strSql = "select UserId from UserInfor where UserName=@UserName and Pwd=@Pwd";
            SqlParameter[] para = new SqlParameter[] { new SqlParameter("@UserName", SqlDbType.NVarChar, 50),

new SqlParameter("@Pwd", SqlDbType.NVarChar, 50) };
            para[0].Value = username;
            para[1].Value = pwd;
            if (SqlHelper.Exists(strSql, para))//判断sql语句里面的结果是否存在
            {

////////context.Response.Write("登录成功")
                dt.Add("Success", true);
                dt.Add("Infor", "登录成功");
            }
            else
            {

////////context.Response.Write("用户名密码错误")
                dt.Add("Success", false);
                dt.Add("Infor", "登录失败");
            }
           context.Response.Write( return jss.Serialize(dt));

}

二:搜索例子

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<script src="js/jquery-1.10.2.min.js"></script>

<script src="js/Login.js"></script>

<style type="text/css">

#txtSel {             width: 300px;             height: 20px;         }

#dcon {             width: 300px;             border: solid 1px #ccc;             display: none;         }

#dcon ul {                 list-style-type: none;                 padding: 0px;                 margin: 0px;                 font-family: "微软雅黑";             }

</style>

</head>

<body>

<input type="text" id="txtSel" />

<div id="dcon">

</div>

</body>

js页面:

$("#txtSel").keyup(function () {      ///手离开键盘的时候,触发的事件
        var title = $.trim($("#txtSel").val());
        if (title == "") {
            $("#dcon").hide();
        }
        else {
            $.post("/ajax/LoginAjax.ashx?cmd=sel", { "title": title }, function (data) {      //////cmd=sel实现在同一个后台中处理多个方法,通过修改下面的ashx
                data = eval('(' + data + ')');                                                                    //////过程是通过传递一个参数,后台接收这个参数进行判断
                if (data.Success) {
                    $("#dcon").show();
                    $("#dcon").html(data.Infor);
                }
                else {
                    $("#dcon").show();
                    $("#dcon").html(data.Infor);
                }
            });
        }
  });

后台ashx:

HttpContext context;

Dictionary<string, object> dt = new Dictionary<string, object>();

JavaScriptSerializer jss = new JavaScriptSerializer();

string strReturn = "";

public void ProcessRequest(HttpContext context)

{

this.context = context;

string cmd = context.Request.QueryString["cmd"].ToString();

switch (cmd)             {

case "login":

strReturn = Login();

break;

case "sel":

strReturn = SelTitle();

break;

}

context.Response.Write(strReturn);

}

public string SelTitle()
        {
            string title = context.Request.Form["title"].ToString();
            string strSql = "select top 10 title from RNews where Title like '%'+@title+'%'";
            SqlParameter[] para = new SqlParameter[] { new SqlParameter("@title", SqlDbType.NVarChar, 50) };
            para[0].Value = title;
            StringBuilder sb = new StringBuilder();
            SqlDataReader read = SqlHelper.ExecuteReader(SqlHelper.connectionString, CommandType.Text, strSql, para);
            if (read.HasRows)
            {
                sb.Append("<ul>");
                while (read.Read())
                {
                    sb.Append(string.Format("<li>{0}</li>", read["title"].ToString()));
                }
                sb.Append("</ul>");
                dt.Add("Success", true);
                dt.Add("Infor", sb.ToString());
            }
            else
            {
                dt.Add("Success", false);
                dt.Add("Infor", "没有数据");
            }
            return jss.Serialize(dt);     ////不定义json(dt.)直接return sb.tostring();也可,在js里直接输出,alert(data)
        }

将①中代码放入函数Login中

public string Login()
        {
            string username = context.Request.Form["username"].ToString();
            string pwd = context.Request.Form["pwd"].ToString();
            ...

...

...
            ...
            else
            {
                dt.Add("Success", false);
                dt.Add("Infor", "登录失败");
            }
            return jss.Serialize(dt);
        }

三:js中获取cookies

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="js/cookies.jquery.js"></script>   //js-cookies插件
    <script type="text/javascript">
        $(function () {
            $("#setCookie").click(function () {
                $.cookie("username", "admin1", { expires: 7, path: "/" });    /// username任意名,保存七天,如果想要保存到小时可以除     7/24=7小时

///path: "/":比如当前文件在一级目录,path的存在是为了能让二级目录,三级目录...都能获取的到
            });
            $("#getCookie").click(function () {
                alert($.cookie("username"));
            });
            $("#reCookie").click(function () {
                $.cookie("username", null);
            });
        });
    </script>
</head>
<body>
    <input type="button" value="存储cookie" id="setCookie" />
    <input type="button" value="获取cookie" id="getCookie" />
    <input type="button" value="清空cookie" id="reCookie" />
</body>
</html>

2015-11-06 ajax的更多相关文章

  1. 2015/11/06 社保查询系统持续 挂机ing

  2. Contest2073 - 湖南多校对抗赛(2015.04.06)

    Contest2073 - 湖南多校对抗赛(2015.04.06) Problem A: (More) Multiplication Time Limit: 1 Sec  Memory Limit:  ...

  3. 苹果被拒的血泪史。。。(update 2015.11)

    项目提交了N此了,也审核N次了,苹果的审核机制依旧那么不急不慢.昨天刚刚又被拒了.回忆下之前的,总结一下吧. 2015.04.28 昨天被拒非常亏,app的评级是17+,但是在app展示图里有一个比较 ...

  4. 11.06水题Test

    11.06水题比赛 题目 描述 做法 \(BSOJ5150\) 求\(n\)个数两两之差的中位数 二分中位数,双指针判定\(\le x\)差值对数 \(BSOJ5151\) 求树的最大匹配和其个数 来 ...

  5. 深入理解ThreadLocal(转)(2015年06月11日)

    注明:转自:http://my.oschina.net/clopopo/blog/149368 学习一个东西首先要知道为什么要引入它,就是我们能用它来干什么.所以我们先来看看ThreadLocal对我 ...

  6. Mybatis源码解析(一)(2015年06月11日)

    一.简介 先看看Mybatis的源码结构图,Mybatis3.2.7版本包含的包共计19个,其他版本可能会少. 每个基于 MyBatis 的应用都是以一个 SqlSessionFactory 的实例为 ...

  7. Twelfth scrum meeting 2015/11/9

    第一阶段的开发即将结束,工程代码已经集合完毕,计划在2015年11月10日发布第一阶段的成果,本次会议主要商量下一阶段需要完成的工作以及页面修改,还有测试人员的bug整理. 会议记录: 第一项:界面修 ...

  8. 软件工程项目组Z.XML会议记录 2013/11/06

    软件工程项目组Z.XML会议记录 [例会时间]2013年11月06日星期二21:00-22:00 [例会形式]小组讨论 [例会地点]三号公寓楼会客厅 [例会主持]李孟 [会议记录]薛亚杰 会议整体流程 ...

  9. 2015/11/9用Python写游戏,pygame入门(8):按钮和游戏结束

    昨天没有更新内容,今天相对多写一些. 因为我们已经基本完成游戏框架,但是游戏结束后,并不知道怎样比较好开始.我本来本着懒的原则,想结束后显示一个黑屏,然后你重新点一下鼠标就重新开始.但是那样实在太不像 ...

  10. Cheatsheet: 2015 11.01 ~ 11.30

    Golang Roadomatic: Node vs. Go Quick Guide to Golang for Java Developers 3 Go Gotchas Web Choosing a ...

随机推荐

  1. Python中__init__()和self的有啥用

    这篇博客让我一下子就理解了,https://www.cnblogs.com/illusion1010/p/9527034.html,感谢博主 由于类可以起到模板的作用,因此,可以在创建实例的时候,把一 ...

  2. react初始

    一.一些基础概念 1.框架:基于整个项目的 2.库:在某个模块中单独使用,轻量级的 在vue中,DOM的操作时DOM指令调用js 在react中,所有的DOM 渲染都是由JS完成的 组件基于视图 模块 ...

  3. iOS进阶之正则表达式

    最近一直在弄正则表达式,于是在这里整理一下,便于日后查阅. 1.常用符号 ^:字符串的开始 $:字符串的结束 *:表示零个或若干个 ?:表示零个或一个 +:表示一个或若干个 | :表示 或 操作 . ...

  4. iOS进阶之UDP代理鉴权过程

    上一篇介绍的是TCP代理的鉴权过程,这篇将介绍UDP代理的大致鉴权过程. 在UDP鉴权过程中,有几点是需要注意的.首先,UDP是一种无连接协议,不需要连接,使用广播的方式:其次,为了通过鉴权,所以需要 ...

  5. vue强制刷新组件

    <component v-if="hackReset"></component>(组件名称) data:hackReset (事件执行) this.hack ...

  6. httplib和urllib2常用方法

    都是几年前用过的,现在翻出来记录一下. import httplib import urllib2 import socket ##---------------------------------- ...

  7. 多线程threading 的使用

    在Python3中,通过threading模块提供线程的功能.原来的thread模块已废弃.但是threading模块中有个Thread类(大写的T,类名),是模块中最主要的线程类,一定要分清楚了,千 ...

  8. 踩坑之路---JWT验证

    使用JWT验证客户的携带的token 客户端在请求接口时,需要在request的head中携带一个token令牌 服务器拿到这个token解析获取用户资源,这里的资源是非重要的用户信息 目前我的理解, ...

  9. Git学习笔记——分支

    分支用法很多,比如bug修复,协作管理,这里只简单介绍我在工作中用到的协作模式. 场景:我自己开发独立功能,在本地为自己创建一个分支就叫localbranch吧,甭管master到哪了,我只管开发我的 ...

  10. SQL实践遇到的知识点

    聚集函数count() count()统计元组的个数,即行数 count(0).count(1)与count(*)的执行效率是一样的 count(column)与count(*) 如果column中含 ...