Ajax 学习笔记
来源:互联网 发布:工业企业利润数据 编辑:程序博客网 时间:2024/06/11 19:09
什么是 AJAX ?
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。
ajax代码讲解(html页面文件):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>lkyAjax</title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#tj").click(function () {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest(); //创建XMLHttpRequest对象;
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () { //onreadystatechage函数,每当readyState属性改变时改变时就会调用该函数。
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { //readyState=0时:请求未初始化;=1时:服务器连接已建立;
//=2时:请求已接受;=3时:请求处理中;=4时:请求已完成,且响应已就绪;
//status=400时ok;=404时未找到页面;
$("#showName").val(xmlhttp.responseText); //responseText获得字符串形式的响应数据。。还有一种响应形式responseXML返回的是xml
}
}
xmlhttp.open("GET", "0000.ashx?actionS=Ajax", false); //如果传入参数为中文必须使用encodeURI(“中国”)不然会出现乱码。。
//opwn(method,url,async);method为:get或post;url为处理页面的url;async为true或false:true代表异步执行;false代表同步执行;
xmlhttp.send(); //send(string)将请求发向服务器、、string仅限于post请求;
});
});
//Jqurey简化后
$(function () {
$("#JAtj").click(function () {
htmlvar = $.ajax({ url: "0000.ashx?actionS=Jquery", async: true });
// $("#Text1").val(htmlvar.responseText);
$("#myDiv").load("0000.ashx?actionS=Jqueryd&&d=" + Math.random());
});
});
</script>
</head>
<body>
<div id="myDiv"></div>
<input type="text" id="showName"/>
<input type="text" id="Text1"/>
<input type="submit" value=" 点我下 " id="tj"/>
<input type="submit" value=" JqueryAjax尽情点吧 " id="JAtj"/>
</body>
</html>
note:
1.与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
- 无法使用缓存文件(更新服务器上的文件或数据库)
- 向服务器发送大量数据(POST 没有数据量限制)
- 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
2.不推荐使用 async=false,但是对于一些小型的请求,也是可以的。
请记住,JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢,应用程序会挂起或停止。
注释:当您使用 async=false 时,请不要编写 onreadystatechange 函数 - 把代码放到 send() 语句后面即可:
xmlhttp.open("GET","test1.txt",false);xmlhttp.send();document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
一般处理程序页面文件
using System;using System.Collections.Generic;using System.Linq;using System.Web;namespace Ajax大练兵{ /// <summary> /// _0000 的摘要说明 /// </summary> public class _0000 : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string name = context.Request["actionS"]; //获取参数值 context.Response.Write("我叫:" + name); //处理后写入页面 context.Response.End(); } public bool IsReusable { get { return false; } } }}
jQuery Ajax 操作函数
jQuery 库拥有完整的 Ajax 兼容套件。其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据。
- ajax学习笔记---什么是Ajax
- [ajax 学习笔记] ajax初试
- Ajax学习笔记-Ajax数据格式
- AJAX学习笔记--慕课网Ajax
- Ajax学习笔记(一)
- Ajax学习笔记(二)
- Ajax学习笔记(三)
- Ajax学习笔记(四)
- Ajax学习笔记(五)
- Ajax学习笔记(六)
- Ajax学习笔记
- Ajax 学习笔记(1)
- Ajax 学习笔记(2)
- Ajax 学习笔记(3)
- Ajax Gossip学习笔记
- AJAX学习笔记--从零开始
- Ajax 学习笔记
- ajax学习笔记
- 高斯判别法
- 分页逻辑设计
- iOS 保存图片到相册
- 转载-zookeeper在kafka中的作用
- ifconfig命令及网络接口
- Ajax 学习笔记
- com.genuitec.runtime.generic.jee70 is not defined
- mui.prompt怎么指定弹出框输入内容是input的类型,原始的type=text,
- python函数的参数定义和可变参数
- rpc
- 笨方法学python-class 10 input
- the content of element type must match解决方法
- mysql与oracle 表字段定义比较
- git 命令整理