优点：减轻服务器的负担,按需取数据,最大程度的减少冗余请求
局部刷新页面,减少用户心理和实际的等待时间,带来更好的用户体验
基于xml标准化,并被广泛支持,不需安装插件等
进一步促进页面和数据的分离
缺点：AJAX大量的使用了javascript和ajax引擎,这些取决于浏览器的支持.在编写的时候考虑对浏览器的兼容性.
AJAX只是局部刷新,所以页面的后退按钮是没有用的.
对流媒体还有移动设备的支持不是太好等

实例化ajax


  //实例化对象

var xmlhttp=null;

if(window.XMLHttpRequest)

{

   xmlhttp=new XMLHttpRequest();

}else{

   xmlhttp=ActiveXObject("Mircrosoft.XMLHTTP");    //浏览器是否支持 XMLHttpRequest 对象

}

//向服务器发送请求

xmlhttp.open("请求的类型get或post","文件在的服务器上位置","true异步或false同步");
xmlhttp.send();//将请求发送到 服务器上

setRequestHeader("头名称","规定头的值");

//服务器响应
responseText(); //获取字符串形式的响应数序
responseXML(); //获取XML形式的响应数据

onreadystatechange事件
//当请求发送到服务器的时候，我们需要执行

XMLHttpRequest的三个重要属性
onreadystatechange 存储函数，每当readyState属性改变时，就会调用该函数
readystate  XMLHttpRequest的状态
0为请求未初始化
1服务器连接已建立
2 请求已接收
3 请求处理中
4 请求已完成,且响应已就绪

status 200 “OK”  404 未找到页面

xmlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

    }

  }

　

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>Examples</title>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

</head>

<body>

    <form  entype="multipart/form-data" name="aax">

    	<table border="0" width="300">

    		<tr>

    			<td>名称</td>

    			<td><input type="text" name=name /></td>

    		</tr>

    		<tr>

    			<td>类型</td>

    			<td>

    			<select name="s">

    				<option value="1">服装</option>

    				<option value="2">视频</option>

    				<option value="3">汽车</option>

    			</select>

    			</td>

    		</tr>

    		<tr>

					<td align="right">单价：</td>

					<td><input type="text" name="price"/></td>

				</tr>

				<tr>

					<td align="right">库存：</td>

					<td><input type="text" name="total"/></td>

				</tr>

				<tr>

					<td align="right">图片：</td>

					<td><input type="file" name="pic"/></td>

				</tr>

				<tr>

					<td align="right" valign="top">描述：</td>

					<td><textarea rows="5" cols="20" name="note"></textarea></td>

				</tr>

				<tr>

					<td colspan="2" align="center">

						<input type="submit" onclick="ajax();"  value="添加"/>   

						<input type="reset" value="重置"/>

					</td>

				</tr>

    	</table>

    </form>

    <script>

function ajax()
{
var f=document.aax;
var name=f.name.value;
var typeid=f.s.value;
var pic=f.pic.value;
var price=f.price.value;
var note=f.note.value;

var xmlhttp=null;
if(window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}else{

xmlhttp=ActiveXObject("Microsoft.XMLHTTP");
}
var lian="name="+name+"&typeid="+typeid+"&pic="+pic+"&price="+price+"&note="+note;
$xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
xmlhttp.open("get","addcas.php",true);
xmlhttp.send(null);
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{

document.getElementById("sed").innerHTML=$xmlhttp.responeseText;
}
};

}

    </script>

</body>

</html>

　　

PHP和ajax详解的更多相关文章

  1. $.ajax()方法所有参数详解;$.get(),$.post(),$.getJSON(),$.ajax()详解

    [一]$.ajax()所有参数详解 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注 ...

  2. Ajax详解及使用Ajax时的返回值类型有哪些？

    Ajax详解 Ajax = 异步 JavaScript 和 XML. Ajax 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以在 ...

  3. $.ajax()详解

    $.ajax()方法详解   jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Str ...

  4. jQuery中$.ajax()详解(转)

    JQuery中$.ajax()方法参数详解     url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get) ...

  5. Ajax详解

    一:什么是Ajax AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法 ...

  6. AJAX 详解注释很全来自互联网

    1: //用户名校验的方法 2: //这个方法使用XMLHTTPRequest对象进行AJAX的异步数据交互 3: var xmlhttp; 4: function verify(){ 5: //1. ...

  7. jquery ajax详解

    详细参数列表url:发送请求的连接地址type:请求方式 get:获取 post:发送 put和deletetimeout:设置请求超时时间async:默认true为异步请求,false同步请求锁住浏 ...

  8. Validform使用ajax详解

    demo.config({    showAllError:true,    url:"这里指定提交地址",    ajaxpost:{        //可以传入$.ajax() ...

  9. 原生态AJAX详解和jquery对AJAX的封装

    AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript    JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...

  10. Ajax详解及其案例分析------如何获得Ajax对象，使用Ajax对象发送GET和POST请求，校验用户名，POST和GET请求时的乱码处理，实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

随机推荐

  1. AVAudioPlayer init 报错： Error Domain=NSOSStatusErrorDomain Code=1937337955

    Error Domain=NSOSStatusErrorDomain Code=1937337955 原因: 音频文件的格式不规范导致 对于iOS7以上的系统(含iOS7),在确定文件格式的情况下可以 ...

  2. linux 硬件信息

    1. 查看物理CPU的个数 #cat /proc/cpuinfo |grep "physical id"|sort |uniq|wc -l 2. 查看逻辑CPU的个数 #cat / ...

  3. CSS的叠加

    CSS中的叠加分为以下三种: 1.上下叠加 CSS部分: #div1{ width:200px; height:50px; margin-bottom:30px; background:#ffff00 ...

  4. Lintcode: Matrix Zigzag Traversal

    Given a matrix of m x n elements (m rows, n columns), return all elements of the matrix in ZigZag-or ...

  5. Matlab基本功能：自定义函数、添加块注释、定时器的试用

    1.自定义函数 新建一个m文件 在m文件里面第一行输入function [X,Y]=pll(X1,Y1,X2,Y2),这里x1 x2 y1 y2是你函数的输入值, x y是输出值,接着定义你要实现的功 ...

  6. 插入多行数据和类似 select union 方法

    Cite:http://blog.csdn.net/downmoon/article/details/5936706 [ruby] view plaincopyprint? Create table ...

  7. contentProvider

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools=&q ...

  8. 使用UIL（Universal-Image-Loader）异步加载图片

    概要: Android-Universal-Image-Loader是一个开源的UI组件程序,该项目的目的是实现可重复使用的异步图像加载.缓存和显示.所以,如果你的程序里需要这个功能的话,使用它,因为 ...

  9. VC6.0 error LNK2001: unresolved external symbol _main（转）

    学习VC++时经常会遇到链接错误LNK2001,该错误非常讨厌,因为对于编程者来说,最好改的错误莫过于编译错误,而一般说来发生连接错误时,编译都已通过.产生连接错误的原因非常多,尤其LNK2001错误 ...

  10. SDK Manager failed to install 'java.exe' locking directory

    转自:http://stackoverflow.com/questions/13587478/sdk-manager-failed-to-install-java-exe-locking-direct ...