AJAX基础
AJAX
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。
AJAX 不是新的编程语言,而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
准备:使用ajax需要一个一般处理程序项,里面执行要执行的C#代码,是以ashx结尾的。
xml:可扩展的标记语言
主要作用:就是记录一些数据,
为什么要用它来记录数据?
因为它是通用的,数据在不同语言之间的传递
劣势:
1、结构繁琐,同样的数据,要编写的内容较多,而且内容量较大
2、获取数据时比较麻烦,需要一个一个的去找标记,然后获取标记中的内容
json:
主要作用:也是记录数据,并且将数据在不同语言之间传递
与xml的区别:
1、结构清晰,类似于实体类的结构组合方式
2、获取数据时,类似实体类的取值方式
实例:
网页端:
<body> <form id="form1" runat="server"> <div> 用户名:<asp:TextBox ID="TextBox1" runat="server"> </asp:TextBox><asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br /> <asp:Button ID="Button1" runat="server" Text="Button" /> </div> </form> </body> </html> <script type="text/javascript"> $("#Button1").click(function () { var oTxt = $("#TextBox1").val(); //1、引用Jquery //2、编写ajax基本格式 $.ajax({ url: "aaaa1.ashx",//要连接到哪个服务端 data: { "id": oTxt },//将什么数据传递到服务端 type: "POST",//用什么样的传递方式传过去 dataType: "json",//返回的数据类型是什么类的 success: function (bbb) { if (bbb.has == 0) { $("#Label1").text("恭喜!用户名可用!"); } else { alert(bbb.nickname);
$("#Label1").text(bbb.pwd+","+bbb.nickname+","+bbb.sex+","+bbb.birthday+","+bbb.nation); } }, error: function () { $("#Label1").text("无法连接到服务器!"); } }); return false; }); </script>
一般处理程序:
public void ProcessRequest(HttpContext context) { string Uname = context.Request["id"]; using (Data0617DataContext con = new Data0617DataContext()) { Users u = con.Users.Where(r => r.UserName == Uname).FirstOrDefault(); if (u != null) {
//json字符串格式
context.Response.Write("{\"has\":\"1\",\"pwd\":\"" + u.PassWord + "\",\"nickname\":\"" + u.NickName + "\",\"sex\":\"" + u.Sex + "\",\"birthday\":\"" + u.Birthday + "\",\"nation\":\"" + u.Nation + "\"}"); } else { context.Response.Write("{\"has\":\"0\"}"); } context.Response.End(); } }