色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

jquery部門水平樹菜單

杜雨婷1年前6瀏覽0評論

jquery部門水平樹菜單是一種可以在網(wǎng)站或者應(yīng)用程序中顯示出組織架構(gòu),包含每個(gè)部門的名稱、成員、職能等等的菜單。這種菜單主要使用jquery技術(shù)實(shí)現(xiàn),可以實(shí)現(xiàn)動態(tài)展示和交互功能,讓用戶能夠更加方便地了解一家公司或組織的內(nèi)部構(gòu)架。

$(document).ready(function() {
var arrowClosed = 'fa-caret-right';
var arrowOpen = 'fa-caret-down';
$('.tree').parent().css('padding', '20px 20px 10px 10px').children('ul').css('margin', '0 0 0 20px');
var tree = $('.tree li:has(ul)');
tree.each(function() {
var branch = $(this); 
branch.prepend("<i class='fa " + arrowClosed + "'></i>");
branch.children().children().css('cursor', 'pointer');
branch.children('ul').toggle();
});
tree.children('i').click(function(event) {
if (this == event.target) {
var branch = $(this).parent();
var icon = $(this).toggleClass(arrowOpen + " " + arrowClosed);
branch.children('ul').toggle();
}
});
});

以上代碼是一個(gè)jquery部門水平樹菜單的實(shí)例。它首先創(chuàng)建一個(gè)樹對象,并且為每個(gè)含有下級組織架構(gòu)的節(jié)點(diǎn)添加一個(gè)閉合箭頭,同時(shí)設(shè)置點(diǎn)擊事件,當(dāng)節(jié)點(diǎn)被點(diǎn)擊時(shí),箭頭切換成打開狀態(tài),同時(shí)顯示該節(jié)點(diǎn)的下屬子節(jié)點(diǎn)的所有數(shù)據(jù)信息。

通過這個(gè)簡單的jquery代碼,我們可以快速實(shí)現(xiàn)一個(gè)樹形菜單,用于展示組織架構(gòu)信息!