Ajax (一)
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
跨语言传递数据:
xml:
结构不清晰
代码量比较大
查找起来比较费事
非面向对象结构
json:
结构清晰
代码量相对较小
面向对象的处理解析方式,查找数据很简单
键值对
{"key1":"value","key2":"value"}
多个对象的json
[{"key1":"value","key2":"value"},{"key1":"value","key2":"value"},{"key1":"value","key2":"value"}]
模糊查询
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.7.2.min.js"></script> <style> * { margin: 0px; padding: 0px; } .tab { text-align: center; margin: auto; width: 80%; margin-top: 10px; } .hea { height: 40px; background-color: #4800ff; color: white; } #tb1 { margin-left: 200px; height: 40px; font-size: 18px; } </style> </head> <body> <form id="form1" runat="server"> <div> <asp:TextBox ID="tb1" runat="server"></asp:TextBox> <table class="tab"> <tr class="hea"> <td>编号</td> <td>商品名</td> <td>数量</td> <td>进货日期</td> <td>保质期/天</td> <td>进货联系人</td> <td>联系电话</td> </tr> <tr> <td id="ids"></td> <td id="sna"></td> <td id="shu"></td> <td id="date"></td> <td id="bao"></td> <td id="ren"></td> <td id="tel"></td> </tr> </table> </div> </form> </body> </html> <script> var oTxt1 = document.getElementById("tb1"); oTxt1.onkeyup = function () { var c = oTxt1.value; $.ajax({ url: "ajax/Handler.ashx", //要将此次请求提交到哪个服务端去 data: { "zhangke": c }, //给服务端带的数据,可以没有,也可以多个 type: "post", //传递的方式 dataType: "json", //数据传递的格式 success: function (aaa) { document.getElementById("ids").innerHTML = aaa.ids; document.getElementById("sna").innerHTML = aaa.sna; document.getElementById("shu").innerHTML = aaa.shu; document.getElementById("date").innerHTML = aaa.date; document.getElementById("bao").innerHTML = aaa.bao; document.getElementById("ren").innerHTML = aaa.ren; document.getElementById("tel").innerHTML = aaa.tel; } }); }; </script>
public Goods Selectmohu(string an) { Goods g = null; cmd.CommandText = "select * from Warehouse where Sname like @a"; cmd.Parameters.Clear(); cmd.Parameters.AddWithValue("@a","%"+an+"%"); conn.Open(); SqlDataReader dr = cmd.ExecuteReader(); if (dr.HasRows) { while (dr.Read()) { g = new Goods(); g.Ids = Convert.ToInt32(dr["Ids"]); g.Sname = dr["Sname"].ToString(); g.Number = dr["Number"].ToString(); g.Date = Convert.ToDateTime(dr["Date"]); g.Shelf = Convert.ToInt32(dr["Shelf"]); g.Contacts = dr["Contacts"].ToString(); g.Tel = dr["Tel"].ToString(); } } conn.Close(); return g; }
<%@ WebHandler Language="C#" Class="Handler" %> using System; using System.Web; using System.Collections.Generic; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { string s = context.Request["zhangke"]; Goods g = new GoodsData().Selectmohu(s); string end = "{\"ids\":\"" + g.Ids.ToString() + "\",\"sna\":\"" + g.Sname + "\",\"shu\":\"" + g.Number + "\",\"date\":\"" + g.Date.ToShortDateString() + "\",\"bao\":\"" + g.Shelf + "\",\"ren\":\"" + g.Contacts + "\",\"tel\":\"" + g.Tel + "\"}"; context.Response.Write(end); context.Response.End(); } public bool IsReusable { get { return false; } } }