html页面使用ztree插件,Ztree.html-优快云博客

后台管理系统-保理软件

.form-group-col-2 {

width: 50%;

float: left;

margin-bottom: 5px;

}

.form-group-col-2 .form-label {

padding: 3px 0px !important;

font-size: 12px !important;

width: 115px;

font-weight: bolder;

cursor: pointer;

}

.form-group-col-2 .form-cont {

margin-left: 125px;

min-height: 33px;

}

.form-control {

font-size: 12px !important;

padding: 4px 15px !important;

}

.serial-number ul li{

cursor: pointer;

}

.tree {

margin: 0;

padding: 0;

list-style-type: none;

}

.tree li {

white-space: nowrap;

}

.tree li ul {

list-style-type: none;

margin: 0;

padding: 0;

}

.tree-node {

height: 18px;

white-space: nowrap;

cursor: pointer;

}

.tree-hit {

cursor: pointer;

}

.tree-expanded,

.tree-collapsed,

.tree-folder,

.tree-file,

.tree-checkbox,

.tree-indent {

display: inline-block;

width: 16px;

height: 18px;

vertical-align: top;

overflow: hidden;

}

.tree-expanded {

background: url('images/tree_icons.png') no-repeat -18px 0px;

}

.tree-expanded-hover {

background: url('images/tree_icons.png') no-repeat -50px 0px;

}

.tree-collapsed {

background: url('images/tree_icons.png') no-repeat 0px 0px;

}

.tree-collapsed-hover {

background: url('images/tree_icons.png') no-repeat -32px 0px;

}

.tree-lines .tree-expanded,

.tree-lines .tree-root-first .tree-expanded {

background: url('images/tree_icons.png') no-repeat -144px 0;

}

.tree-lines .tree-collapsed,

.tree-lines .tree-root-first .tree-collapsed {

background: url('images/tree_icons.png') no-repeat -128px 0;

}

.tree-lines .tree-node-last .tree-expanded,

.tree-lines .tree-root-one .tree-expanded {

background: url('images/tree_icons.png') no-repeat -80px 0;

}

.tree-lines .tree-node-last .tree-collapsed,

.tree-lines .tree-root-one .tree-collapsed {

background: url('images/tree_icons.png') no-repeat -64px 0;

}

.tree-line {

background: url('images/tree_icons.png') no-repeat -176px 0;

}

.tree-join {

background: url('images/tree_icons.png') no-repeat -192px 0;

}

.tree-joinbottom {

background: url('images/tree_icons.png') no-repeat -160px 0;

}

.tree-folder {

background: url('images/tree_icons.png') no-repeat -208px 0;

}

.tree-folder-open {

background: url('images/tree_icons.png') no-repeat -224px 0;

}

.tree-file {

background: url('images/tree_icons.png') no-repeat -240px 0;

}

.tree-loading {

background: url('images/loading.gif') no-repeat center center;

}

.tree-checkbox0 {

background: url('images/tree_icons.png') no-repeat -208px -18px;

}

.tree-checkbox1 {

background: url('images/tree_icons.png') no-repeat -224px -18px;

}

.tree-checkbox2 {

background: url('images/tree_icons.png') no-repeat -240px -18px;

}

.tree-title {

font-size: 12px;

display: inline-block;

text-decoration: none;

vertical-align: top;

white-space: nowrap;

padding: 0 2px;

height: 18px;

line-height: 18px;

}

.tree-node-proxy {

font-size: 12px;

line-height: 20px;

padding: 0 2px 0 20px;

border-width: 1px;

border-style: solid;

z-index: 9900000;

}

.tree-dnd-icon {

display: inline-block;

position: absolute;

width: 16px;

height: 18px;

left: 2px;

top: 50%;

margin-top: -9px;

}

.tree-dnd-yes {

background: url('images/tree_icons.png') no-repeat -256px 0;

}

.tree-dnd-no {

background: url('images/tree_icons.png') no-repeat -256px -18px;

}

.tree-node-top {

border-top: 1px dotted red;

}

.tree-node-bottom {

border-bottom: 1px dotted red;

}

.tree-node-append .tree-title {

border: 1px dotted red;

}

.tree-editor {

border: 1px solid #95B8E7;

font-size: 12px;

line-height: 16px;

padding: 0 4px;

margin: 0;

width: 80px;

outline-style: none;

vertical-align: top;

position: absolute;

top: 0;

}

.tree-node-proxy {

background-color: #ffffff;

color: #000000;

border-color: #95B8E7;

}

.tree-node-hover {

background: #eaf2ff;

color: #000000;

}

.tree-node-selected {

background: #ffe48d;

color: #000000;

}

.tree-node-hidden {

display: none;

}

树

- 我的邮箱11
  - QQ邮箱
    - 收件箱

$('.icon-caret-down,.icon-caret-right').on('click',function(){

$(this).toggleClass('icon-caret-down icon-caret-right');

$(this).parent().find('ul').toggleClass('layui-show')

})

$(".layui-show>li>a").on('click',function(){

var thisC = $(this).prev();

if(thisC.is(":checked")) {

$(this).prev().prop("checked",false);

console.log('222')

}else{

$(this).prev().prop("checked",true);

console.log('111')

}

})

一键复制

编辑

Web IDE

原始数据

按行查看

历史