• easyUI中tree的简单使用


    一、在JS中的代码

    $('#tt').tree({
    url: baseCtx + 'lib/easyui-1.4/demo/tree/tree_data1.json',//tree数据的来源,json格式的数据
    method: 'get',
    animate: true,
    checkbox: true,//有复选框
    // cascadeCheck:false,

    //选中的事件
    onSelect: function(node) {
    if(node.checked) {
    $(this).tree("uncheck", node.target);//把指定节点设置为未选中
    } else {
    var cknodes = $(this).tree("getChecked");
    for(var i = 0; i < cknodes.length; i++) {
    $(this).tree("uncheck", cknodes[i].target);//把指定节点设置为未选中
    }
    //再选中改节点
    $(this).tree("check", node.target);//把指定节点设置为选中

    //预留ajax
    }
    },

    //右击弹出的菜单
    onContextMenu: function(e, node) {
    e.preventDefault();//阻止自带的右击菜单
    $(this).tree('select', node.target);
    $('#mm').menu('show', {
    left: e.pageX,
    top: e.pageY
    });
    },

    //点击时候的事件
    onClick: function(node){
    var nodes = $('#tt').tree('getChecked'); // get checked nodes
    var nodes1 = $('#tt').tree('getChecked', 'unchecked'); // get unchecked nodes
    var nodes2 = $('#tt').tree('getChecked', 'indeterminate'); // get indeterminate nodes
    var nodes3 = $('#tt').tree('getChecked', ['checked','indeterminate']); // get checked and ind

    alert(nodes1);
    //alert(node.text); // alert node text property when clicked
    }
    });

    //追加子节点的方法

    function append() {
    var textName = "";
    $.messager.prompt('输入框', '请输入要添加的部门/组的名称', function(r) {
    if(r) {
    textName = r;
    var t = $('#tt');
    var node = t.tree('getSelected');
    t.tree('append', {
    parent: (node ? node.target : null),
    data: [{
    text: textName
    }]
    });
    }
    });
    }

    //删除节点的方法

    function removeit() {
    var node = $('#tt').tree('getSelected');
    $('#tt').tree('remove', node.target);
    }

  • 相关阅读:
    js获取当前时间,日期格式为年月日
    create-react-app里添加less
    react css 模块化
    react 点击父级元素 不触发子级元素click事件
    react-router-dom 实现路由左右滑动进入页面的效果
    vue路由左右侧滑动 react路由左右侧滑动
    react 父组件不能直接在子组件上加className,也得用props传递过去
    react 父组件调用子组件方法
    css滚动相关问题记录
    javascript异步编程的几种方法
  • 原文地址:https://www.cnblogs.com/Lxiaojiang/p/5950456.html
Copyright © 2020-2023  润新知