PHP和ajax详解
优点:减轻服务器的负担,按需取数据,最大程度的减少冗余请求
局部刷新页面,减少用户心理和实际的等待时间,带来更好的用户体验
基于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+"¬e="+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详解的更多相关文章
- $.ajax()方法所有参数详解;$.get(),$.post(),$.getJSON(),$.ajax()详解
[一]$.ajax()所有参数详解 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注 ...
- Ajax详解及使用Ajax时的返回值类型有哪些?
Ajax详解 Ajax = 异步 JavaScript 和 XML. Ajax 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以在 ...
- $.ajax()详解
$.ajax()方法详解 jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Str ...
- jQuery中$.ajax()详解(转)
JQuery中$.ajax()方法参数详解 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get) ...
- Ajax详解
一:什么是Ajax AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法 ...
- AJAX 详解注释很全来自互联网
1: //用户名校验的方法 2: //这个方法使用XMLHTTPRequest对象进行AJAX的异步数据交互 3: var xmlhttp; 4: function verify(){ 5: //1. ...
- jquery ajax详解
详细参数列表url:发送请求的连接地址type:请求方式 get:获取 post:发送 put和deletetimeout:设置请求超时时间async:默认true为异步请求,false同步请求锁住浏 ...
- Validform使用ajax详解
demo.config({ showAllError:true, url:"这里指定提交地址", ajaxpost:{ //可以传入$.ajax() ...
- 原生态AJAX详解和jquery对AJAX的封装
AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...
- Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表
本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...
随机推荐
- Java nio 笔记:系统IO、缓冲区、流IO、socket通道
一.Java IO 和 系统 IO 不匹配 在大多数情况下,Java 应用程序并非真的受着 I/O 的束缚.操作系统并非不能快速传送数据,让 Java 有事可做:相反,是 JVM 自身在 I/O 方面 ...
- Redis:安装
此篇文章并不介绍linux下安装方法.围绕windows安装而介绍 两种安装方式: 1)下载压缩包,解压后(运行起来有个窗口,关闭掉就不在运行),没有windows服务被注册:可以只用命令在cmd将其 ...
- nodejs发起HTTPS请求并获取数据
摘要:在网站中有时候需要跨域请求数据,直接用Ajax无法实现跨域,采用其他方式需要根据不同的浏览器做相应的处理.用Nodejs可以很好的解决这些问题,后台引用HTTPS模块,发送和返回的数据均为JSO ...
- Splay!
#include<cstdio> #include<cstdlib> ; ; ; int lim; struct SplayTree { . int sz[maxn]; . ] ...
- C++Builder生成的EXE如何在别的电脑上正常运行
Project --> Option --> Packages -->Runtime Packages --> Link with runtime packages 属性改为f ...
- [原创]java WEB学习笔记76:Hibernate学习之路---Hibernate介绍,hibernate 环境的搭建
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- [原创] hadoop学习笔记:卸载和安装jdk
一,卸载jdk 1.确定jdk版本 #rpm -qa | grep jak 可能的结果: java-1.7.0-openjdk-1.7.0.75-2.5.4.2.el7_0.x86_64 java- ...
- 进击的java - tomcat的安装,配置都正确之后,还是报错
1.问题 配置Apatch Tomcat过程报错: The CATALINA_HOME environment variable is not defined correctly.This envir ...
- springday03-go2
新建springmvc01项目1.创建项目,导入jar包 拷贝jar/spring/first下的五个spring的jar包,以及jar/spring/mvc下的两个mvcjar包放在lib下 2.创 ...
- 开发系统时候运行程序突然报出“WebDev.WebServer40.exe已停止工作”的错误
已经解决,问题描述:在开发系统时候运行程序突然报出“WebDev.WebServer40.exe已停止工作”的错误,程序调试运行,发现程序在打开数据库时候报错,也就是Connection.Open() ...