js封装任意级列表模块

在开发中常常会使用到多级列表。为了不再重复写构建列表的代码，可以规定列表的数据格式，并将列表封装成一个可重用的模块，因为递归解析列表数据源，所以支持任意多级，代码在最后给出链接。

效果（可拖动列表头部标题，拉伸列表）：

任意级列表

要使用这个模块，传入的数据要遵守以下格式

 var node0 = {
        "nodeLevels": 0,
        "type": 0,
        "isChecked": false,
        "nodeData": {"text": "广东省", "headImgUrl": null}
        "sonNodes": [{
            "nodeLevels": 1,
            "type": 0,
            "sonNodes": []
    };

其中的 sonNodes一定要赋值为数组，数组里面可放置子节点,然后，节点放入数组内，作为参数，实例化一个列表,如下

<script src="jquery-2.1.0.js"></script>
<script src="require.js"></script>
<script src="LZF.TreeView.js"></script>
   
   requirejs.config({
    paths: {
        "jquery": "jquery-2.1.0",
    }
});
require(['TreeView'], function (TreeView) {
    var dataSource = [node0];

    //'mBody'是treeView的父元素的id, 
    //dataSource 是列表的数据源
    //第三个参数，是点击列表后的回调，返回末节点的nodeData的数据和选中或未选中状态

    var treeView = TreeView.initWithFrame('mBody', dataSource, function (text) {
        console.log(text);
    });
});

源码链接

源码链接