jQuery 把列表数据转成Json再输出为如下 dom树
列表字段分别为Title Level Parent Content, JQ代码如下
/**
* @create: nelson
* @initTree 初始化生成菜单
* @调用方式
$("#menu").initTree(qListview);*/$.fn.extend({
initTree:function(qListview) {var This = $(this);var That =$(qListview);var keyArr = newArray();var jsonArr = newArray();
That.find("thead th").each(function() {
keyArr.push($(this).text());
});
That.find("tbody tr").each(function(index) {var jsonObj ={};
$(this).find("td").each(function(n) {
jsonObj[keyArr[n]]= $(this).html();
});
jsonArr.push(jsonObj);
});
This.attr('class', 'lv1').append('
$.each(jsonArr,function(entryIndex, entry) {switch (entry['Level']) {case '1':
This.find("ul").append('
' + entry['Title'] + '');break;case '2':This.find(">ul>li>a").each(function() {if (entry['Parent'] == $(this).text()) {
$(this).attr('class', 'parent');if ($(this).parent().find('.lv2').html() ==undefined) {
$(this).parent().append('
- ' + '
- ' + entry['Title'] + '' + '
}else{
$(this).parent().find('.lv2>ul').append('
' + entry['Title'] + '');}return false;
}
});break;case '3':
This.find(".lv2>ul>li>a").each(function() {if (entry['Parent'] == $(this).text()) {
$(this).attr('class', 'parent');if ($(this).parent().find('.lv3').html() ==undefined) {
$(this).parent().append('
- ' + '
- ' + entry['Title'] + '' + '
}else{
$(this).parent().find('.lv3>ul').append('
' + entry['Title'] + '');}return false;
}
});break;case '4':
This.find(".lv3>ul>li>a").each(function() {if (entry['Parent'] == $(this).text()) {
$(this).attr('class', 'parent');if ($(this).parent().find('.lv4').html() ==undefined) {
$(this).parent().append('
- ' + '
- ' + entry['Title'] + '' + '
}else{
$(this).parent().find('.lv4>ul').append('
' + entry['Title'] + '');}return false;
}
});break;default:break;
}
});returnjsonArr;
}
});