UCHOME的AJAX分享
最近match001.com项目做一个发送电子喜帖的功能,发现QQ油箱明信片功能差不多。于是乎构思做成那个样子。
有几点需要实现的:
背景图片、结婚相片的加载。
N多的事件绑定
跟相册数据绑定,选择相册列出所有相片,并且相片分页。所有的都AJAX实现
初始化一个DIV用来控制上层图片位置移动,根据不同背景图片,初始化不不同的控制DIV。
JS收集背景图片与相片的相关信息以及他们的位置数据,AJAX到后台处理。根据不同的方式处理,比如 view预览,保存发送等等。
这里针对第三点说说,AJAX得到用户相册数据。
这里需要用到AJAX和数据分页,UCHOME里有两个非常棒的函数。ajaxget()和muti()。
ajaxget(url, showid, waitid);参数url为请求路径(必选参数),showid为AJAX请求后返回内容的显示ID(必选参数),waitid为等待请求时候显示loading...的ID(可选,没这个参数的话默认将showid作为waitid)。
uchome的使用AJAX时候有一个注意地方,刚不了解朋友可能尝试使用如下JS代码处理AJAX:
var x = new('XML', '');
x.get(url, function(s){
//some code;
});
处理返回一个XML或者HTML格式数据,echo 出来后,再用自己用JS控制显示数据。这里要说的是UCHOME经常会碰到一个XML错误的位置。。什么的错误信息,之前我也是这样处理,搞了好久,后来Google搜一把,原来不能简单后台echo输出。后来想到UCHOME李的template函数,于是乎做一个模板,数据PHP后台得到后不做任何处理,跟其他页面一样,存于变量里,在模板里调用就是。至于分页,也一样,UCHOME里multi函数返回的就是一个分页链接。也在模板里处理显示。而前段JS只需要这样:
ajaxget(url, showid);
具体PHP代码如下:
$albumid = ($_GET[albumid]) ? $_GET['albumid'] : '';
if($albumid == '') exit('error');
$perpage = 8; //每页要显示的条数
$page = empty($_GET['page']) ? 1 : intval($_GET['page']);
if($page<1) $page=1;
$start = ($page-1)*$perpage;
ckstart($start, $perpage);
$wheresql = " albumid='$albumid' AND uid='$space[uid]'";
$count = $_SGLOBAL['db']->result($_SGLOBAL['db']-
相关文档:
JSON插件提供了一种名为json的ResultType,一旦为某个Action指定了一个类型为json的Result,则该Result无需映射到任何视图资源。因为JSON插件会负责将Action里的状态信息序列化成JSON格式的数据,并将该数据返回给客户端页面的JavaScript。
简单地说,JSON插件允许我们在JavaScript中异步调用Action,而且Action不再需 ......
jQuery 是什么?
请访问 Ajax 技术资源中心,这是有关 Ajax 编程模型信息的一站式中心,包括很多文档、教程、论坛、blog、wiki 和新闻。任何 Ajax 的新信息都能在这里找到。
jQuery 由 John Resig 创建于 2006 年初,对于任何使用 JavaScript 代码的程序员来说,它是一个非常有用的 JavaScript 库。无论您是刚刚接触 Java ......
代码下载:http://code.google.com/p/ajaxautocomplete/downloads/list
Auto Complete的jQuery控件。
首先是需要设计下我们的DIV最后应该显示成什么样子,我的CSS不咋地。瞎玩呢。样子如下:
首先是一个DIV,然后是添加一个ul和几个li tag:
<div id="nav">
<ul>
<li><a>Text1 field1& ......
1创建两张页面 Reg.aspx、CallServer.aspx。
在Reg.aspx页面的html中放 一个层和一个文本框
<div id="aa">
<asp:TextBox id="txtuser" runat="server" Width="136px"></asp:TextBox>
</div>
<span id="errInfo">请输入用户名</span>
在Reg.aspx页面中写javascript
定义二个变量 ......