|
作者：feifengxlq<http://blog.sohu.com/members/xlq521/>
时间：2006-3-2
邮箱：[email protected]
前面发了一些文章，主要是关于ajax的一些资料及小测试程序。这次我给出一个比较完整的AJAX实例，希望对感兴趣的人有所帮助，也希望能和大家一起交流切磋。
AJAX实例：操作文本文件
测试环境：win xp SP2操作系统，apache2.054服务器，php5.12,mysql 5.0 数据库（测试通过）
注意事项：1、界面的CSS上我使用了Phzzy上传文件里面的那个，在此表示感谢！^_^
2、php版本低于5.1的，请自己写一个writefile.php文件（file_put_contents在php5以上才支持）
一下我贴出并详细说明一些关键代码，源文件已经打包（见附件）。
index.html
CODE:[Copy to clipboard]<script language="javascript">
//建立xmlhttp，由于不同浏览器支持不同的原因才这么复杂，具体可以参考我前面发布的"AJAX简介"一文
function initxmlhttp()
{
var xmlhttp
try {
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp=false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
xmlhttp=false;
}
}
if (!xmlhttp && window.createRequest) {
try {
xmlhttp = window.createRequest();
} catch (e) {
xmlhttp=false;
}
}
return xmlhttp;
}
//从readfile.php中_get到文本文件test.txt的数据
function readcontent()
{
var xmlhttp=initxmlhttp();
var showcontent=document.getElementById("message");
var url="readfile.php";
xmlhttp.open("GET",url,true);
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
showcontent.innerHTML=xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
//将数据_post到writefile.php以将数据写入test.txt
function writecontent()
{
var xmlhttp=initxmlhttp();
var content=document.forms[0].content.value;
var url="writefile.php";
var poststr="content="+content;
xmlhttp.open("POST",url,true);
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlhttp.send(poststr);
}
</script>
redefile.php
CODE:[Copy to clipboard]<?
header ("Cache-Control: no-cache, must-revalidate");//这个是必须的，不然读出的数据将是以前的缓存数据
echo file_get_contents("test.txt");
?>
|
