php 屏幕无闪烁刷新,php+ajax 实现web页面无闪烁刷新 页面前端和后端交互

处理这个问题，首先要将网页的前端和后端分开。前端是呈现给用户看的，后端是真正数据处理逻辑，Ajax巧好起到中间人的作用。最初想用frame框架和js结合实现实现页面的无闪烁交互，但这种方式并不是真正意义上的动态交互。Ajax恰好可以很方便的解决这个问题。

分三个部分来来实现这个需求：1.用户界面，可以位简单的html； 2.  Ajax处理页面； 3. php底层逻辑

以动态请求刷新时间为例。

用户界面html，使用setInterval设置定时刷新，调用js中的refresh函数。

Time Refresh

a {display:block;float:left;width:257px;height:30px;

border:2px solid #09f;background:#fff;text-align:center;

line-height:30px;margin:5px;

}

#div1 {margin:5px;width:800px;height:100px;float:left;

text-align:center;border:2px solid #09f;background:#fff;

}

setInterval("refresh()",3000); //设定每隔3s刷新一次

2. Ajax部分 ajax.js代码

var xmlHttp;

//判断浏览器是IE 还是其他浏览器

function s_xmlhttprequest(){

if(window.ActiveXObject){

xmlHttp= new ActiveXObject('Microsoft.XMLHTTP');

}else if(window.XMLHttpRequest) {

xmlHttp= new XMLHttpRequest();

}

}

function refresh(){

s_xmlhttprequest();

xmlHttp.open("GET","result.php",true);

xmlHttp.onreadystatechange = byphp;

xmlHttp.send(null);

}

//接受数据并显示 分为5个状态0,1,2,3,4,5

function byphp(){

if(xmlHttp.readyState==4){

var data=xmlHttp.responseText;

document.getElementById('div1').innerHTML=data;

}

}

3. php部分

header("content-type:text/html; charset=utf-8");

echo "Time : ".date('Y-m-d H:i:s',time()).". ";

?> 可以完美的实现页面无闪烁刷新和页面的前后端交互问题