這幾夜心里頗不平靜, 奈何 JS水平有限,前臺(tái)效果耗時(shí)四天,后臺(tái)傳值一天,直至昨夜丑時(shí)測(cè)試初步完成,其實(shí)就是一個(gè)給tree來(lái)授權(quán),網(wǎng)上開(kāi)源的插件很多,如treejs、easyui 等等,只是這里授權(quán)稍有不同,如下圖,只能放在Table中去實(shí)現(xiàn)。一行一行的寫(xiě)js,最后寫(xiě)的差不多有個(gè)100多行。
項(xiàng)目原界面不方便截圖,這里隨手寫(xiě)個(gè)原生態(tài)的 Demo
如圖所示,首先這是一個(gè)Table,無(wú)論枝節(jié)點(diǎn)還是葉節(jié)點(diǎn)都作為一行(tr),功能菜單列表中葉節(jié)點(diǎn)(無(wú)分支) 后對(duì)應(yīng)新增、修改等六個(gè)功能(復(fù)選框)
先來(lái)說(shuō)說(shuō)前臺(tái)需要實(shí)現(xiàn)的效果:
①點(diǎn)擊枝節(jié)點(diǎn),其下所有的節(jié)點(diǎn)(枝/葉)收縮/展開(kāi)
②點(diǎn)擊枝節(jié)點(diǎn)前的復(fù)選框,其下所有節(jié)點(diǎn)(枝/葉)、葉節(jié)點(diǎn)所在行的新增、修改等復(fù)選框勾選/取消
eg: 點(diǎn)擊藍(lán)圈中的復(fù)選框,則紅框內(nèi)所有的復(fù)選框都被勾選/取消
針對(duì)JQ,只要能給每個(gè)標(biāo)簽一個(gè)值,name、id之類的用以區(qū)別,就能使用Jquery選擇器來(lái)確定該元素