Home > php教程 > php手册 > Ajax+PHP快速上手及简单应用

Ajax+PHP快速上手及简单应用

WBOY
Release: 2016-06-06 19:53:32
Original
945 people have browsed it

简介: Ajax 由 HTML 、 JavaScript? 技术、 DHTML 和 DOM 组成,这一杰出的 方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。 对于 Ajax ,最核心的一个对象是 XMLHttpRequest ,所有的 Ajax 操作都离不开对这 个对象的操作。 创建XMLHttpRequest

简介:

Ajax HTMLJavaScript?技术、DHTML DOM 组成,这一杰出的方法可以将笨拙的Web 界面转化成交互性的 Ajax 应用程序。

对于Ajax,最核心的一个对象是XMLHttpRequest,所有的Ajax操作都离不开对这个对象的操作。

创建XMLHttpRequest对象

对于IE浏览器:

xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
Copy after login


对于其他浏览器:

xmlHttp = new XMLHttpRequest();
Copy after login


不同的浏览器对javascript中的XMLHttpRequest对象的支持是不一样的,所以需要根据情况做一下判断。

 

XMLHttpRequest对象相关方法

 

打开请求

XMLHttpRequest.open(传递方式,地址,是否异步请求)
Copy after login

 

准备就绪执行

XMLHttpRequest.onreadystatechange
Copy after login

 

获取执行结果

XMLHttpRequest.responseText
Copy after login


一个简单的php+Ajax的例子:

首先是test.js文件:

var xmlHttp;
function S_xmlhttprequest(){
	if(window.ActiveXObject){
		xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
	}else if(window.XMLHttpRequest){
		xmlHttp=new XMLHttpRequest();
	}
}
function php100(url){
	S_xmlhttprequest();
	xmlHttp.open("GET","do.php?id="+url,true);
	xmlHttp.onreadystatechange=byphp;
	xmlHttp.send(null);
}
function byphp(){
	var byphp100=xmlHttp.responseText;
	document.getElementById('php100').innerHTML=byphp100;
}
Copy after login


然后是执行php操作的文件,do.php

<?PHP $id=@$_GET[id];
for($i=1;$i<10;$i++){
	echo $id;
}
Copy after login


然后是前端显示页面,test.html

<script src="test.js" type="text/javascript"></script>
<a href="#" onclick="php100(1)">1</a> ||
<a href="#" onclick="php100(2)">2</a> ||
<a href="#" onclick="php100(3)">3</a>

<div id="php100"></div>
Copy after login


 

 

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template