彭成刚的jQuery ajax 代码。。超简单。。

现在来写ajax教材。。其实已经超级简单了。。

以前的时候只是针对IE的时候。。还是可以写个函数就KO了的。。但是现在各大浏览器林立。。弄的我们

有时候也没有办法。。支持IE。。支持FF。。我可是很懒的。。

既然已经有了ajax框架。。何必再自己写一个呢。。o(∩_∩)o...

这里我们来用jQuery的吧。。jQuery的ajax超级简单。。一个get函数搞定！

可是很多基础不好的家伙。。还是有点不能理解。。没办法。。还是讲下原理吧。。

ajax 白话 ---> 异步传输。。就是不刷新页面获得数据。。

那么再白点就是，用个函数从一个文件获得你所需要的数据。。

这个时候就会出现了一个事件了。。啥事件尼。。那就是装载事件啊。。你比如点击一个按钮。。执行一

个函数了。这个函数获取一个文件的数据。。而这个时候，这个数据的数据量很大，这个时候，你是不是

会等那么一会儿啊。。比如说5秒。。那么你获取完数据才把数据显示到页面上。。这个时候就出现了咱

们的重头演员了！！ [装载完毕事件] 也就是说，你的操作都要写在这里，比如把数据显示出来啊。。什

么的。。

说了这么多。。其实就是为了引出 [装载完毕事件]

其他的也就没什么了。。下面看看实际上的代码是如何写的吧。。实在是太简单了。。幸福吧！

第一步 加入jQuery类库 放在<head></head>里面
<script language="JavaScript" type="text/javascript" src="jquery-1.2.1.pack.js"></script>

第二步 写这个ajax函数吧！在这之前我来布置下body的成员吧。。
<a href="#" onclick="javascript:o();">kkk</a>
<div id="pp">55</div>
一个a和一个div，a的onclick事件运行了o函数。。现在咱们来写这个o函数吧！！
function o(){
 $.get(
  "peng.txt",
  function(data){
  $("#pp").html(data);
    }
 );
}
peng.txt 是咱们获取数据的文件，这个可以是任何web文件。。
function(data) 就是咱们上面反复说的 [装载完毕事件] 而data就是获得的数据。。
$("#pp").html(data); 这个就是咱们执行的函数体。。它相当与 document.getElementById("pp").innerHTML = data;
就是语法不同。。意思是一样的。。简单吧。。吼吼。。

最后小提示下：数据要是utf8 的哦。。 也就是这里的peng.txt 的编码

代码下载

posted @ 2007-12-24 17:00  彭成刚  阅读(689)  评论(0)  编辑  收藏  举报