这几夜心里颇不平静, 奈何 JS水平有限,前台效果耗时四天,后台传值一天,直至昨夜丑时测试初步完成,其实就是一个给tree来授权,网上开源的插件很多,如treejs、easyui 等等,只是这里授权稍有不同,如下图,只能放在Table中去实现。一行一行的写js,最后写的差不多有个100多行。
项目原界面不方便截图,这里随手写个原生态的 Demo
如图所示,首先这是一个Table,无论枝节点还是叶节点都作为一行(tr),功能菜单列表中叶节点(无分支) 后对应新增、修改等六个功能(复选框)
先来说说前台需要实现的效果:
①点击枝节点,其下所有的节点(枝/叶)收缩/展开
②点击枝节点前的复选框,其下所有节点(枝/叶)、叶节点所在行的新增、修改等复选框勾选/取消
eg: 点击蓝圈中的复选框,则红框内所有的复选框都被勾选/取消
针对JQ,只要能给每个标签一个值,name、id之类的用以区别,就能使用Jquery选择器来确定该元素