简简单单——无限级数据JSON格式及JS解析

最新推荐文章于 2021-05-15 19:00:55 发布

最新推荐文章于 2021-05-15 19:00:55 发布 · 141 阅读

文章标签：

#json #php #javascript #ViewUI

本文介绍了一种使用PHP实现无限级树形结构的JSON数据生成方法，并通过JavaScript进行了数据解析，适用于展示用户邀请关系等场景。

公司要做个Flash效果的页面，需要个无限级树，显示用户邀请的好友极其下线，由此就构成了无限级的关系，可能下线有无限多。Flash需要JSON格式的数据，于是，就有了如下代码：(PHP实现，C#类似，JSON库自己去下吧~~)

代码

// --查询用户下线信息，返回JSON，用于flash
if ( ! empty ( $_GET [ ' action ' ]) &&! empty ( $_GET [ ' invite ' ])){
// 固定参数请求才会返回信息
if ( $_GET [ ' action ' ] == ' getinfo ' && $_GET [ ' invite ' ] == 1 ){

// 数据实体,一个实体类
class UcInvite{

// ---显示用的数据信息
public $fuid ; // 用户id
public $funame ; // 用户名
public $furl ; // 用户空间地址
//---显示用的数据信息

public $fchilds ; // 子类集合
}

$invitecount = 0 ; // 总数量，用于记录全部下线数量
//递归实现方法
function GetShowTreeInvite( $uid ){
global $_SGLOBAL , $invitecount ;
// 组织sql语句并查询，表中fuid是下线的id,uid是父id，fusername是用户名字
$inv_sql = " selectfuid,fusernamefrom " . tname( " invite " ) . " whereuid= " . $uid ;
$inv_query = $_SGLOBAL [ ' db ' ] -> query( $inv_sql );
// 下表及返回数组
$index = 0 ;
$inviteTree = Array ();
$invitezcount = 0 ; // 每个子类下的数量
//循环添加信息到数组
while ( $v = $_SGLOBAL [ ' db ' ] -> fetch_array( $inv_query )){
$ui = new UcInvite();
$ui -> fuid = $v [ ' fuid ' ];
$ui -> funame = $v [ ' fusername ' ];
$ui -> furl = " /home/space.php?uid= " . $v [ ' fuid ' ];
// 调用自己，递归查询子类信息
$ui -> fchilds = GetShowTreeInvite( $v [ ' fuid ' ]);
// 插入返回的数组中
$inviteTree [ $index ] = $ui ;
$index ++ ;
$invitecount ++ ;
$invitezcount ++ ;
}
// 记录当前下线的下线数量
$inviteTree [ ' invitezcount ' ] = $invitezcount ;
// 返回数组信息
return $inviteTree ;
}

$fuid = empty ( $_GET [ ' fuid ' ]) ? $space [uid] : $_GET [ ' fuid ' ];

// 根据当前登录用户ID查询信息，并返回一个集合
$inviteTree = GetShowTreeInvite( $fuid );
// 记录总下线数
$inviteTree [ ' invitecount ' ] = $invitecount ;

// 引入json库，这里用的是Services_JSON
//因为并不确定服务器都是PHP5.2以上版本，所以没有用自带的JSON函数
require_once ( ' ../plugins/JSON/JSON.php ' );

// json输出
$json = new Services_JSON();
echo $json -> encode( $inviteTree );
exit ;
} else {
echo ' 请求参数错误！ ' ;
exit ;
}
}
// --查询用户下线信息，返回JSON，用于flash

以上代码返回一个JSON字符串，如：

{'0':{'fuid':'950','funame':'郭梓原','furl':'/home/space.php?uid=950','fchilds':{'invitezcount':0}},'invitezcount':1,'invitecount':1}

这里只查询了一个

接下来用JS进行以下解析：

代码

< scripttype = " text/javascript " src = " http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js " >< / script>
< scripttype = " text/javascript " >
// fuid用户ID
// funame用户名称
// furl用户主页地址
// invitezcount每个用户的子类数量
// invitecount该用户的所有下级数量
var str = "" ;
function GetShow(obj,qi,index){

for ( var one in obj)
{
for ( var key in obj[one])
{
index ++ ;
if (key == " fchilds " && obj[one][key][ ' invitezcount ' ] != 0 ){
var aqi = qi;
if (index > 1 )aqi += "       "

GetShow(obj[one][key],aqi,index)
}
if (key != ' fchilds ' ){
if (key == " fuid " ){
str += qi + key + " = " + obj[one][key] + " , " ;
} else {
str += key + " = " + obj[one][key] + " , " ;
}
if (key == " furl " ){
str += " <br/> " ;
}

}
}
if (one == " invitezcount " || one == " invitecount " ){
str += qi + one + " = " + obj[one] + " <br/> " ;
}
}
}
// 固定参数do=charadegarden&action=getinfo&invite=1，fuid为测试时使用，不填写将调用系统当前登录的用户ID
var url = ' http://localhost/home/space.php?do=charadegarden&action=getinfo&invite=1&fuid=344 ' ;
$.get(url, function (html){

// 获得json并转为对象
if (html){
var obj = eval( " [ " + html + " ] " );
GetShow(obj[ 0 ], "" , 1 )
document.write(str);
document.write( " <br/><br/><br/><br/> " );
document.write( " <b>JSON格式：</b><br/> " );
document.write(html);
}

});

< / script>

这样，两个无限级的操作就完成了，结果截图：