AJAX学习实例（二）

作者：feifengxlq
时间：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]

//建立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);
}
redefile.php

CODE:
[Copy to clipboard]