2015-11-06 ajax
一:登录页面.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的更多相关文章
- 2015/11/06 社保查询系统持续 挂机ing
- Contest2073 - 湖南多校对抗赛(2015.04.06)
Contest2073 - 湖南多校对抗赛(2015.04.06) Problem A: (More) Multiplication Time Limit: 1 Sec Memory Limit: ...
- 苹果被拒的血泪史。。。(update 2015.11)
项目提交了N此了,也审核N次了,苹果的审核机制依旧那么不急不慢.昨天刚刚又被拒了.回忆下之前的,总结一下吧. 2015.04.28 昨天被拒非常亏,app的评级是17+,但是在app展示图里有一个比较 ...
- 11.06水题Test
11.06水题比赛 题目 描述 做法 \(BSOJ5150\) 求\(n\)个数两两之差的中位数 二分中位数,双指针判定\(\le x\)差值对数 \(BSOJ5151\) 求树的最大匹配和其个数 来 ...
- 深入理解ThreadLocal(转)(2015年06月11日)
注明:转自:http://my.oschina.net/clopopo/blog/149368 学习一个东西首先要知道为什么要引入它,就是我们能用它来干什么.所以我们先来看看ThreadLocal对我 ...
- Mybatis源码解析(一)(2015年06月11日)
一.简介 先看看Mybatis的源码结构图,Mybatis3.2.7版本包含的包共计19个,其他版本可能会少. 每个基于 MyBatis 的应用都是以一个 SqlSessionFactory 的实例为 ...
- Twelfth scrum meeting 2015/11/9
第一阶段的开发即将结束,工程代码已经集合完毕,计划在2015年11月10日发布第一阶段的成果,本次会议主要商量下一阶段需要完成的工作以及页面修改,还有测试人员的bug整理. 会议记录: 第一项:界面修 ...
- 软件工程项目组Z.XML会议记录 2013/11/06
软件工程项目组Z.XML会议记录 [例会时间]2013年11月06日星期二21:00-22:00 [例会形式]小组讨论 [例会地点]三号公寓楼会客厅 [例会主持]李孟 [会议记录]薛亚杰 会议整体流程 ...
- 2015/11/9用Python写游戏,pygame入门(8):按钮和游戏结束
昨天没有更新内容,今天相对多写一些. 因为我们已经基本完成游戏框架,但是游戏结束后,并不知道怎样比较好开始.我本来本着懒的原则,想结束后显示一个黑屏,然后你重新点一下鼠标就重新开始.但是那样实在太不像 ...
- Cheatsheet: 2015 11.01 ~ 11.30
Golang Roadomatic: Node vs. Go Quick Guide to Golang for Java Developers 3 Go Gotchas Web Choosing a ...
随机推荐
- 初试fiddler
1.tools->Options->HTTPS勾:Decrypt HTTPS traffic //勾:Ignore server certificate errors(unsafe) // ...
- Windows Server Backup(2016) 备份
1. 使用 Windows Server Backup 备份 如果服务器没有启用 Windows Server Backup,需要打开服务器管理器,如下图 点击添加角色和功能,根据向导,添加 Wind ...
- Excel导出采用mvc的ExcelResult继承遇到的问题Npoi导出
#region 构建Excel文档 //创建Excel文件的对象 NPOI.HSSF.UserModel.HSSFWorkbook book = new NPOI.HSSF.UserModel.HSS ...
- export ,export default 和 import 区别 以及用法
首先要知道export,import ,export default是什么 ES6模块主要有两个功能:export和importexport用于对外输出本模块(一个文件可以理解为一个模块)变量的接口i ...
- spring boot 2使用Mybatis多表关联查询
模拟业务关系:一个用户user有对应的一个公司company,每个用户有多个账户account. spring boot 2的环境搭建见上文:spring boot 2整合mybatis 一.mysq ...
- linux 查看命令总结
1.tail -f -n 200 cat.log 2.使用less命令 less all.2018092510.0.log 打开log文件,默认显示100行记录. 输入/CustGroupListSe ...
- 解决 EDAS:Upload failed: The right margin is 0.535 in on page 1 问题
参考: IEEETran page margins 解决 EDAS:Upload failed: The right margin is 0.535 in on page 1 问题 在 EDAS 上上 ...
- js回调函数以及同步与异步
1. 背景介绍javascript的单线程特性由于javascript语言是一门“单线程”的语言,所以,javascript就像一条流水线,仅仅是一条流水线而已,要么加工,要么包装,不能同时进行多个任 ...
- 打包发布Python模块或程序,安装包
Python模块.扩展和应用程序可以按以下几种形式进行打包和发布: python setup.py获取帮助的方式 python setup.py --help python setup.py --he ...
- 项目中使用的artTemplate笔记
1.注意数据格式为 var results = { data:[ {name:'xiaoming',age:'18'},{name:'xiaohong',age:'18'},{name:'xiaogo ...