XSPHP_AJAX
一、 什么是Ajax?
abort() 停止当前请求
getAllResponseHeaders() 作为字符串返回完整的headers
getResponseHeader("headerLabel") 作为字符串返回单个的header标签
open("method","URL",[asyncFlag]) method:请求的方式，get/post 设置请求的目标 URL，同步还是异步，[asyncFlag] true异步，false同步
send(content) 发送请求
setRequestHeader("label", "value") 设置header并和请求一起发送
Ajax引擎对象中的属性
onreadystatechange 状态改变的事件触发器
readyState 对象状态(integer):
0 = 未初始化 1 = 读取中 2 = 已读取 3 = 交互中 4 = 完成
responseText 服务器进程返回数据的文本版本
responseXML 服务器进程返回数据的兼容DOM的XML文档对象
status 服务器返回的状态码, 如：404 = "文件未找到" 、200 ="成功"
Ajax采用是异步交互过程
1. 局部刷新
2. 按需取数据
二、创建Ajax对象， 这是学习Ajax的第一步
创建对象过程比较复杂一点，但这些代码是固定的，以后可以直接拷贝使用
将创建XMLHttpRequest对象的过程写到一个函数中
主要是把浏览器分成两种
一种是IE系列的浏览器（IE5.0 IE5.5 IE6.0, IE7 IE8）
一种是非IE浏览器(都是按W3C标准) FF Mozilla NetScape
abort() 停止当前请求
getAllResponseHeaders() 作为字符串返回完整的headers
getResponseHeader("headerLabel") 作为字符串返回单个的header标签
open("method","URL",[asyncFlag]) method:请求的方式，get/post 设置请求的目标 URL，同步还是异步，[asyncFlag] true异步，false同步
send(content) 发送请求
setRequestHeader("label", "value") 设置header并和请求一起发送
Ajax引擎对象中的属性
onreadystatechange 状态改变的事件触发器
readyState 对象状态(integer):
0 = 未初始化 1 = 读取中 2 = 已读取 3 = 交互中 4 = 完成
responseText 服务器进程返回数据的文本版本
responseXML 服务器进程返回数据的兼容DOM的XML文档对象
status 服务器返回的状态码, 如：404 = "文件未找到" 、200 ="成功"
使用GET传输数据
createAjax.js
function createAjax(){
var request=false;
//window对象中有XMLHttpRequest存在就是非IE，包括（IE7，IE8）
if(window.XMLHttpRequest){
request=new XMLHttpRequest();
if(request.overrideMimeType){
request.overrideMimeType("text/xml");
}
//window对象中有ActiveXObject属性存在就是IE
}else if(window.ActiveXObject){
var versions=['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Msxml2.XMLHTTP.7.0','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i
//var ajax=createAjax(); html02.html
demo
data.txt
yc--30--0.2511825079771022yc--30--0.21456491625027485yc--30--0.113762922229733使用POST方式传输数据
demo
server.php
接收数据：
demo
server.php
';
?>
这个是中国字
获取XML数据
yc
30
yc
30
yc
30
yc
30
yc
30
demo
传输数组
demo
server.php
'11111',"two"=>'22222',"three"=>'333333');
echo json_encode($arr);
/*
json_encode()返回 value 值的 JSON 形式 或者在失败时返回 FALSE ,相当于生成javascript对象的属性赋值的格式
{"one":"11111","two":"22222","three":"333333"}
json_decode()接受一个 JSON 格式的字符串并且把它转换为 PHP 变量
$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}';
var_dump(json_decode($json)); //生成php对象格式
var_dump(json_decode($json, true)); //生成php数组格式
输出：
object(stdClass)#1 (5) {
["a"] => int(1)
["b"] => int(2)
["c"] => int(3)
["d"] => int(4)
["e"] => int(5)
}
array(5) {
["a"] => int(1)
["b"] => int(2)
["c"] => int(3)
["d"] => int(4)
["e"] => int(5)
}
*/
补充一下javascript创建对象的两种方式
创建直接的实例
这个例子创建了对象的一个新实例，并向其添加了四个属性：
实例
person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
替代语法（使用对象 literals）：
实例
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
三、创建Ajax对象简化Ajax的使用
ajax.js
//revcType 接收的类型
function createAjax(revcType) {
var aj = new Object();
//判断接收类型是否存在
aj.revcType = revcType ? revcType.toUpperCase(): "HTML";
aj.targetUrl = '';
aj.sendString = ''; //发送的内容
aj.resultHandle = null; //回调函数
//创建ajax对象的方法
aj.createHttpXmlRequest = function() {
var request=false;
//window对象中有XMLHttpRequest存在就是非IE，包括（IE7，IE8）
if(window.XMLHttpRequest){
request=new XMLHttpRequest();
if(request.overrideMimeType){
request.overrideMimeType("text/xml");
}
//window对象中有ActiveXObject属性存在就是IE
}else if(window.ActiveXObject){
var versions=['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Msxml2.XMLHTTP.7.0','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i
demo
server.php
例子：验证用户注册时用户名的唯一性
form.html
demo
form.php
query($sql);
if($result->num_rows > 0) {
echo '该'.$_POST['username'].'用户，已存在';
}else {
echo '该'.$_POST['username'].'用户不存在，可以注册';
}
$result->close();
$mysqli->close();mysql> select * from user;
+----+-------+----------------------------------+---------+---------+---------+
| id | name | pwd | allow_1 | allow_2 | allow_3 |
+----+-------+----------------------------------+---------+---------+---------+
| 1 | admin | 21232f297a57a5a743894a0e4a801fc3 | 1 | 1 | 1 |
| 2 | yc | a2bf364d91c65964491d6ef7c0a36c46 | 0 | 0 | 1 |
+----+-------+----------------------------------+---------+---------+---------+
2 rows in set (0.05 sec)
使用Ajax实现无刷新分页
html03.html
ajax无刷新分页
数据加载中........
server.php
set_charset('gbk');
$result = $mysqli->query('select * from books');
//page(多少数据，每页显示几条)
$page = new Page($result->num_rows,5);
$sql = 'select bookid,bookname,author,price,detail from books '.$page->limit;
//echo $sql;
$result = $mysqli->query($sql);
echo '';
echo '';
echo 'bookid ';
echo 'bookname ';
echo 'author ';
echo 'price ';
echo 'detail ';
echo ' ';
while($row = $result->fetch_assoc()) {
echo '';
foreach($row as $col) {
echo "{$col} ";
}
echo ' ';
}
echo ''.$page->fpage().'
';
$result->close();
$mysqli->close();page.class.php
分页代码，在每个分页连接上加入javascrip:setPage(url)函数。这样才能调用ajax
"个记录", "prev"=>"上一页", "next"=>"下一页", "first"=>"首 页", "last"=>"尾 页");
private $listNum=8;
/*
* $total
* $listRows
*/
public function __construct($total, $listRows=10, $pa=""){
$this->total=$total;
$this->listRows=$listRows;
$this->uri=$this->getUri($pa);
$this->page=!empty($_GET["page"]) ? $_GET["page"] : 1;
$this->pageNum=ceil($this->total/$this->listRows);
$this->limit=$this->setLimit();
}
private function setLimit(){
return "Limit ".($this->page-1)*$this->listRows.", {$this->listRows}";
}
private function getUri($pa){
$url=$_SERVER["REQUEST_URI"].(strpos($_SERVER["REQUEST_URI"], '?')?'':"?").$pa;
$parse=parse_url($url);
if(isset($parse["query"])){
parse_str($parse['query'],$params);
unset($params["page"]);
$url=$parse['path'].'?'.http_build_query($params);
}
return $url;
}
private function __get($args){
if($args=="limit")
return $this->limit;
else
return null;
}
private function start(){
if($this->total==0)
return 0;
else
return ($this->page-1)*$this->listRows+1;
}
private function end(){
return min($this->page*$this->listRows,$this->total);
}
private function first(){
$html = '';
if($this->page==1)
$html.='';
else
$html.=" {$this->config["first"]} ";
return $html;
}
private function prev(){
$html = '';
if($this->page==1)
$html.='';
else
$html.=" {$this->config["prev"]} ";
return $html;
}
private function pageList(){
$linkPage="";
$inum=floor($this->listNum/2);
for($i=$inum; $i>=1; $i--){
$page=$this->page-$i;
if($page<1)
continue;
$linkPage.=" {$page} ";
}
$linkPage.=" {$this->page} ";
for($i=1; $i<=$inum; $i++){
$page=$this->page+$i;
if($page<=$this->pageNum)
$linkPage.=" {$page} ";
else
break;
}
return $linkPage;
}
private function next(){
$html = '';
if($this->page==$this->pageNum)
$html.='';
else
$html.=" {$this->config["next"]} ";
return $html;
}
private function last(){
$html = '';
if($this->page==$this->pageNum)
$html.='';
else
$html.=" {$this->config["last"]} ";
return $html;
}
private function goPage(){
return ' ';
}
function fpage($display=array(0,1,2,3,4,5,6,7,8)){
$html[0]=" 共有{$this->total}{$this->config["header"]} ";
$html[1]=" 每页显示".($this->end()-$this->start()+1)."条，本页{$this->start()}-{$this->end()}条 ";
$html[2]=" {$this->page}/{$this->pageNum}页 ";
$html[3]=$this->first();
$html[4]=$this->prev();
$html[5]=$this->pageList();
$html[6]=$this->next();
$html[7]=$this->last();
$html[8]=$this->goPage();
$fpage='';
foreach($display as $index){
$fpage.=$html[$index];
}
return $fpage;
}
}