AJAX封装类使用指南

首页 > 网络编程 > AJAX相关 更新日期: 2015-08-20
这篇文章主要介绍了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 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>

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


> 本站内容系网友提交或本网编辑转载,其目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请及时与本网联系,我们将在第一时间删除内容!

相关文章
  • Prototype最新版(1.5rc2)使用指南(1)
    在写这个指南之前,先介绍一下Prototype主要是干吗的,如果你比较关注ajax/javascipt方面的应用,你应该早就听说过这个javascript framework. Prototype是一个基础的javascript应用框架,先引用一段官方网站的介绍 Prototype is a JavaScript framework that aims to ...
  • Prototype使用指南之base.js
    base.js中包含下面的内容  类的创建与继承: Class.create(): 创建一个类,例如 person=Class.create() Object.extend(destination, source): 把source中方法属性copy到destination(使用for propertyin source),需要注意的是,javascript ...
  • Ajax修改购物车示例
    Ajax修改购物车示例
    这篇文章主要介绍了Ajax修改购物车的思路及具体实现,需要的朋友可以参考下1.购物车类的设计 ShoppingCartItem:书的封装,包括书名,数量,价格三个属性,以及对应的getter和setter方法. ShoppingCart:购物车封装类,items为 Map<String, ShoppingCartItem> ,以及加入购物车,得到 ...
  • 探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
    查了不少资料,最后,还是jquery指南的书上找到了详细的参数async: false,,做好后,示例代码放上,如下所示,需要的朋友可以参考下 代码如下:  $.ajax       ({            cache: false,            async: false,   // 太关键了,学习了,同步和异步的参数            d ...
  • 用Ajax来控制书签和回退按钮的代码
    用Ajax来控制书签和回退按钮的代码
    这篇文章描述了一个支持Ajax应用书签和回退按钮的开源的javascript库.在这个指南的最后,开发者将会得出一个甚至不是Google Maps 或者 Gmail那样处理的Ajax的解决方案:健壮的,可用的书签和向前向后的动作能够象其他的web页面一样正确的工作. Ajax:怎样去控制书签和回退按钮 这篇文章说明了一个重要的成果,Ajax应用目前面对着书签 ...
猜你喜欢