html jquery 菜单选中,jQuery树形菜单插件多级菜单选中代码

特效描述：jQuery 树形菜单插件 多级菜单选中。jQuery树形菜单插件，点击展开多级下拉菜单，点击选中菜单效果代码。

代码结构

1. 引入JS

2. HTML代码

打开 | 关闭

d = new dTree('d', true); //参数一: 树名称。参数二：单选多选 true多选 false单选 默认单选

d.add(0, -1, '权限管理');

d.add(1, 0, 'authority', '0001', '日常工作', true, false);

d.add(2, 1, 'authority', '0002', '新建工作', true, false);

d.add(3, 2, 'authority', '0003', '人事 ', true, false);

d.add(4, 2, 'authority', '0004', '财务', false, false);

d.add(5, 2, 'authority', '0005', '客服', false, false);

d.add(15, 3, 'authority', '0006', '请假申请', false, false);

d.add(16, 3, 'authority', '0007', '出差申请', false, false);

d.add(17, 3, 'authority', '0008', '招聘申请', false, false);

// dTree实例属性以此为： 节点ID，父类ID，chechbox的名称，chechbox的值，chechbox的显示名称，

//chechbox是否被选中--默认是不选，chechbox是否可用：默认是可用，节点链接：默认是虚链接

d.add(6, 0, 'authority', '0012', '一级菜单2 ', true, false);

d.add(7, 6, 'authority', '0013', '二级菜单2 ', true, false);

d.add(8, 7, 'authority', '0014', '用户管理 ', false, false);

d.add(9, 7, 'authority', '0015', '用户组管理 ', false, false);

d.add(11, 0, 'authority', '0016', '一级菜单3 ', true, false);

d.add(12, 11, 'authority', '0017', '二级菜单3 ', true, false);

d.add(13, 12, 'authority', '0018', '用户管理 ', false, false);

d.add(14, 12, 'authority', '0019', '用户组管理 ', false, false);

d.add(20, 0, 'authority', '0020', '测试', true, false);

document.write(d);

d.openAll();

选择结果：

function test() {

var count = 0;

var obj = document.all.authority;

for (i = 0; i < obj.length; i++) {

if (obj[i].checked) {

alert(obj[i].value);

count++;

}

}

}

//搜索节点并展开节点

function nodeSearching() {

var dosearch = $.trim($("#dosearch_text").val());//获取要查询的文字

var dtree_div = $("#dtree_div").find(".dtree_node").show().filter(":contains('" + dosearch + "')");//获取所有包含文本的节点

$.each(dtree_div, function (index, element) {

var s = $(element).attr("node_id");

d.openTo(s);//根据id打开节点

});

}

//#region 页面执行入口

$(document).ready(function () {

//#region 浏览器检测相关方法

window["MzBrowser"] = {}; (function () {

if (MzBrowser.platform) return;

var ua = window.navigator.userAgent;

MzBrowser.platform = window.navigator.platform;

MzBrowser.firefox = ua.indexOf("Firefox") > 0;

MzBrowser.opera = typeof (window.opera) == "object";

MzBrowser.ie = !MzBrowser.opera && ua.indexOf("MSIE") > 0;

MzBrowser.mozilla = window.navigator.product == "Gecko";

MzBrowser.netscape = window.navigator.vendor == "Netscape";

MzBrowser.safari = ua.indexOf("Safari") > -1;

if (MzBrowser.firefox) var re = /Firefox(\s|\/)(\d+(\.\d+)?)/;

else if (MzBrowser.ie) var re = /MSIE( )(\d+(\.\d+)?)/;

else if (MzBrowser.opera) var re = /Opera(\s|\/)(\d+(\.\d+)?)/;

else if (MzBrowser.netscape) var re = /Netscape(\s|\/)(\d+(\.\d+)?)/;

else if (MzBrowser.safari) var re = /Version(\/)(\d+(\.\d+)?)/;

else if (MzBrowser.mozilla) var re = /rv(\:)(\d+(\.\d+)?)/;

if ("undefined" != typeof (re) && re.test(ua))

MzBrowser.version = parseFloat(RegExp.$2);

})();

});

//显示删除

function showRemove(obj) {

$(obj).addClass("remove");

}

//隐藏删除

function hideRemove(obj) {

$(obj).removeClass("remove");

}

//鼠标移动到删除图标，显示手(pointer)

function setRemove(obj, event) {

var width = $(obj).width();

var left = $(obj).position().left;

var e = event || window.event;

var x = IsIE(GetVersion()) ? e.x : e.pageX;

if (x > left + width - 9) {

$(obj).css("cursor", "pointer")

} else {

$(obj).css("cursor", "default")

}

}

function GetVersion() { return MzBrowser.version; }

function GetName() {

var name = "undefined";

if (MzBrowser.ie) { name = "ie"; }

else if (MzBrowser.firefox) { name = "firefox"; }

else if (MzBrowser.safari) { name = "safari"; }

return name;

}

function IsIE(versionValue) {

if (versionValue == 11) {

return IsIE11();

}

var name = GetName();

var version = GetVersion();

return name == 'ie' && parseInt(version) == versionValue;

}