最土Ajax实现/json

转：http://hi.baidu.com/wrjgg/blog/item/2bf63eea37827df5cf1b3e28.html

最近在看最土团购系统，做一个二次开发，当分析到Ajax得时候，怎么也理不清思路，于是查查资料整理了一下，现在已经很清楚了，在这里分享一下，方便大家以后学习和开发。

最土开源团购程序ajax操作：

1.ajax返回信息显示对话框

if ( $action == 'dialog' ) {
    $html = render('ajax_dialog_order');
    json($html, 'dialog');
}

2.提示窗口
json('充值失败', 'alert'); 

3.客户端页面重新载入
json(null, 'refresh');

4.客户端同时执行多个操作，例如本例为显示完提示对话框后，重新载入页面
        json(array(
                    array('data' => "代金券使用成功", 'type'=>'alert'),
                    array('data' => null, 'type'=>'refresh'),
                  ), 'mix');

5.客户端端执行相应的Javascript脚本程序，本例中调用相应的  X.misc.noticenext(id,nid)  函数      
json("X.misc.noticenext({$id},{$nid});", 'eval');

6.执行相关的局部更新操作

$d = array(
            'html' => $v,
            'id' => 'coupon-dialog-display-id',
            );
    json($d, 'updater');

---------------------------------------------

服务器端与ajax相关操作的函数

include/function/common.php
function json($data, $type='eval') {
    $type = strtolower($type);
    $allow = array('eval','alert','updater','dialog','mix', 'refresh');
    if (false==in_array($type, $allow))
        return false;
    Output::Json(array( 'data' => $data, 'type' => $type,));
}
include/class/output.class.php
staticpublic function Json($data=null, $error=0)
{
$result = self::error( $error );
if ( null !== $data )
{
    $result['data'] = $data;
}
    die( json_encode($result) );
}

---------------------------------------------

客户端JS函数

X.get = function(u) {
    return X.ajax(u, 'GET')
};
X.post = function(u) {
    return X.ajax(u, 'POST')
};
X.ajax = function(u, method){
    jQuery.ajax({
        url: u,
        dataType: "json",
        success: X.json
    });
    return false
};
X.json = function(r){
    var type = r['data']['type'];
    var data = r['data']['data'];
    if (type == 'alert') {
        alert(data)
    } else if (type == 'eval') {
        eval(data)
    } else if (type == 'refresh') {
        window.location.reload()
    } else if (type == 'updater') {
        var id = data['id'];
        var inner = data['html'];
        jQuery('#' + id).html(inner)
    } else if (type == 'dialog') {
        X.boxShow(data, true)
    } else if (type == 'mix') {
        for (var x in data) {
            r['data'] = data[x];
            X.json(r)
        }
    }
};

js调用：

在模板manage_team_edit.html中有这样一段js：

这里算是jQuery使用的入口，经分析，在后台处理的时候没有加载Jquery文件的链接，但是在系统中就是存在这样的文件并且被使用了，

最后经查阅相关资料，发现最土开发人员把所有要调用的js全部通过shell压缩到index_no.js和index.js里面了。在用到的时候，就调用这两个文件就可以了。这样多个文件放在一起减少了请求的服务器的次数，减少页面加载JS的大小，使页面响应更快。下面是具体的代码：

这样一分析，所有的问题都明朗啦

相关文章：http://hi.baidu.com/wrjgg/blog/category/%D7%EE%CD%C1%CD%C5%B9%BA%CF%B5%CD%B3%BF%AA%B7%A2