ajax与javascript无限级树
过去的一年里,在项目内,我已经不记得写过多少和树相关的控件了。有无限级的,有数据少量一次性加载的,有数据大用ajax分步加载的,有的还加入一些业务逻辑,有的甚至还做过本地缓存。各种各样的树,其结构还是一样的,为了追求简单,全部都是<ul>与<li>结构,子级错位用 margin-left 实现,展开收缩的状态有的用加减的字符表示,漂亮一点就用图标。
下面的例子,数据是省市区三级的数据,约三千多条记录,例子采用 Ajax 分步加载子级数据,并缓存起来。如点击“广东省”,则马上获取该省所有的市,如果切换到其他省再切换回“广东省”,则使用刚才所获取的结果,不再请求。达到最小请求数量。如果整体数据量小,没必要分步获取增大请求次数,可以在页面初始化时一次性获取所有数据,每次展开节点时读取部分数据亦可。两种方法适用的场合不同。