最土Ajax实现/json

心已赠人 2021-11-04 11:16 225阅读 0赞

转：[http://hi.baidu.com/wrjgg/blog/item/2bf63eea37827df5cf1b3e28.html][http_hi.baidu.com_wrjgg_blog_item_2bf63eea37827df5cf1b3e28.html]

最近在看最土团购系统，做一个二次开发，当分析到Ajax得时候，怎么也理不清思路，于是查查资料整理了一下，现在已经很清楚了，在这里分享一下，方便大家以后学习和开发。![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang -]

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

**![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang - 1]**

**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  
**static**public 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：

![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang - 2]  
这里算是jQuery使用的入口，经分析，在后台处理的时候没有加载Jquery文件的链接，但是在系统中就是存在这样的文件并且被使用了，

![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang - 3]  
最后经查阅相关资料，发现最土开发人员把所有要调用的js全部通过shell压缩到**index\_no.js**和**index.js**里面了。在用到的时候，就调用这两个文件就可以了。这样多个文件放在一起减少了请求的服务器的次数，减少页面加载JS的大小，使页面响应更快。下面是具体的代码：

![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang - 4]  
这样一分析，所有的问题都明朗啦![最土Ajax实现/json - GreatWang - 追求属于自己的一切][Ajax_json - GreatWang - 5]

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

转载于:https://www.cnblogs.com/greatwang/archive/2011/12/31/2648237.html

[http_hi.baidu.com_wrjgg_blog_item_2bf63eea37827df5cf1b3e28.html]: http://hi.baidu.com/wrjgg/blog/item/2bf63eea37827df5cf1b3e28.html
[Ajax_json - GreatWang -]: http://img.ph.126.net/TFIyor2Bd5AUofbHlJMTYQ==/3198681635340661230.jpg
[Ajax_json - GreatWang - 1]: http://img.ph.126.net/4g5SaIrZEwIXKVNiG8ZPfw==/3842977857030895239.jpg
[Ajax_json - GreatWang - 2]: http://img.ph.126.net/pJvQ2w9A2kaZdIXmlBrNiw==/3842977857030895241.jpg
[Ajax_json - GreatWang - 3]: http://img.ph.126.net/VA5n6KUpR2JRPK7CZqAJww==/3842977857030895242.jpg
[Ajax_json - GreatWang - 4]: http://img.ph.126.net/OgGVQsCwkX2nsnM2kMfw_g==/3842977857030895244.jpg
[Ajax_json - GreatWang - 5]: http://img.ph.126.net/ZSrRo8sYeylGlLl_QSOIlg==/3383047745086771961.jpg
[http_hi.baidu.com_wrjgg_blog_category_D7_EE_CD_C1_CD_C5_B9_BA_CF_B5_CD_B3_BF_AA_B7_A2]: http://hi.baidu.com/wrjgg/blog/category/%D7%EE%CD%C1%CD%C5%B9%BA%CF%B5%CD%B3%BF%AA%B7%A2