AJAX封装类使用指南

 更新时间:2014年12月26日 11:59:16   投稿:hebedich  
这篇文章主要介绍了AJAX封装类使用指南,需要的朋友可以参考下

AJAX说起来感觉很难,但是把他封装起来你会发现使用起来很简单了,当然也是简单的应用了,譬如留言板的应用等,这里首先,先送大家一个礼物那就是封装好的AJAX的类,下载地址http://xiazai.jb51.net/201412/yuanma/ajax3.0(jb51.net).rar 这里下载这个类,然后教大家怎么使用吧!
实例哦!

复制代码 代码如下:

<html>
 <head>
  <title>Ajax实例</title>
  <script src="ajax3.0.js"></script>
 </head> 
 <body>
  <script>
   document.write(new Date()+"<br>");
   document.write(new Date()+"<br>");
   document.write(new Date()+"<br>");
  </script> 
  <div id="show" style="background:yellow;border:1px solid blue">
   内容加载中..... 
  </div>
  <script>
   function read() {
    Ajax().get("read.php?num="+Math.random(), function(data){
     document.getElementById("show").innerHTML=data;   
    }) 
   }
   read();
   setInerval("read()",3000);
   function send() {
    var username=document.frm.username;
    var desn=document.frm.desn;
    var datao = {username:username.value, desn:desn.value};
    Ajax().post("save.php", datao, function(data){
      
      read();
      username.value="";
      desn.value="";
    });
   }
  </script>
  <form name="frm">
   用户名:<input type="text" name="username" value=""><br>
   内容: <textarea cols="40" rows="5" name="desn"></textarea>
   <input type="button" onclick="send()" value="留言">
  </form>
  <script>
   document.write(new Date()+"<br>");
   document.write(new Date()+"<br>");
   document.write(new Date()+"<br>");
  </script>
 </body>
</html> 

首先先加入我们的ajax3.0.js这个文件,然后我们就写这个东西Ajax().post("save.php", datao, function(data))
ajax()两个参数 第一个返回xml json 还是html 第二个true异步传输 false同步传输 post后边大家看的明白吧 呵呵
下边是 php的文件

复制代码 代码如下:

//read.php
 @readfile("demo.txt");
//save.php
// header("Content-Type:text/html;charset=gb2312")
 $username=$_POST["username"];
 $desn = $_POST["desn"];

 $fh = fopen("demo.txt", "a");

 $text=$username."--".date("Y-m-d H:i:s")."说:".$desn."<br>";

 fwrite($fh, $text);

 fclose($fh);
//demo.text
fdsafdsa--2012-11-01 12:24:04说:fdsafdsa<br>fdsafdsa--2012-11-01 12:24:07说:fdsafdsafsa<br>111--2012-11-01 12:25:07说:2222<br>eeee--2012-11-01 12:25:10说:eeee<br>fdsfds--2012-11-01 12:25:12说:fdsfdsfds<br>fdsfds--2012-11-01 12:25:19说:fdsfdsfs<br>fdsfdsf--2012-11-01 12:25:22说:sfdsfdsfds<br>fdsafdsa--2012-11-01 12:26:00说:fdsafdsa<br>

嗯 今天有点事 ,写的可能不够详细,有什么不懂的,请大家留言,

相关文章

  • ajax怎么打开新窗口具体如何实现

    ajax怎么打开新窗口具体如何实现

    本文为大家介绍下ajax如何打开新窗口,下面有段代码,需要的朋友可以了解下
    2014-01-01
  • ajax响应json字符串和json数组的实例(详解)

    ajax响应json字符串和json数组的实例(详解)

    下面小编就为大家带来一篇ajax响应json字符串和json数组的实例(详解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • Ajax的小贴士使用小结

    Ajax的小贴士使用小结

    Ajax的小贴士使用小结...
    2007-10-10
  • Ajax学习笔记整理

    Ajax学习笔记整理

    Ajax: Asynchronous JavaScript and Xml , 异步js脚本和xml , 常用来实现页面局部的异步刷新, 对提高用户体验有很大帮助. Xml在多语言时较有优势, 但Ajax技术实际上较多采用Json对象而不是Xml来处理数据
    2016-01-01
  • 经典的20道AJAX面试题(必知必会)

    经典的20道AJAX面试题(必知必会)

    本文给大家介绍20道jquery ajax面试题,在前端开发阶段经常会问到,今天小编给大家分享经典的20道AJAX面试题,感兴趣的朋友一起学习吧
    2016-09-09
  • 前后端ajax和json数据交换方式

    前后端ajax和json数据交换方式

    这篇文章主要介绍了前后端ajax和json数据交换方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-06-06
  • Ajax实现带有验证码的局部刷新登录界面

    Ajax实现带有验证码的局部刷新登录界面

    很多登录界面都有验证码功能局部刷新效果,接下来通过本文给大家分享ajax实现带有验证码的局部刷新登录界面,感兴趣的朋友一起看看吧
    2016-09-09
  • ajax的两种提交方式(get/post)和两种版本

    ajax的两种提交方式(get/post)和两种版本

    本篇也用encodeURI对字符串做了加密,并在类里做了解码,其中需要一些注意的地方在源码里做了注释。get/post两种提交方式,但get提交容易乱码,一定多加注意
    2013-09-09
  • Jquery基于Ajax方法自定义无刷新提交表单Form实例

    Jquery基于Ajax方法自定义无刷新提交表单Form实例

    这篇文章主要介绍了Jquery基于Ajax方法自定义无刷新提交表单Form的方法,结合实例详细分析了Ajax无刷新提交表单的完整实现过程,并总结了使用中的注意事项,具有很好的借鉴价值,需要的朋友可以参考下
    2014-11-11
  • ajax异步读取后台传递回的下拉选项的值方法

    ajax异步读取后台传递回的下拉选项的值方法

    今天小编就为大家分享一篇ajax异步读取后台传递回的下拉选项的值方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08

最新评论