[jquery] jQuery jsTree V3.2.1 基础Demo

<linkrel="stylesheet" href="../dist/themes/default/style.min.css" /><scriptsrc="../dist/jquery-2.1.4

<link rel="stylesheet" href="../dist/themes/default/style.min.css" />    <script src="../dist/jquery-2.1.4.min.js"></script>    <script src="../dist/jstree.min.js"></script>

引入对应的文件

　

 $("#deptIdModify").jstree({                    "core" : {                        'multiple':false,//单选,true 为多选                        "data": {                            "url" :"../common/getSelectByCodeId2?codeId=PSB",                            'dataType':'json',                            'data' : function (node) {                                return { 'id' : node.id};                            }                        }                    },                    "plugins" : [ "wholerow", "checkbox" ]                });

 

deptIdModify 可以为:div,ul其他没有试过。使tree节点选中..

$("#deptIdModify").jstree(true).check_node(data.formData.deptCode);

 但是上面的选择有一个问题，第一次打开页面无法选中，修改后如下：

 

$("#deptIdModify").jstree({                    "core" : {                        'multiple':false,                        "data": {                            "url" :"../common/getSelectByCodeId2?codeId=PSB",                            'dataType':'json',                            'data' : function (node) {                                return { 'id' : node.id};                            }                        }                    },                    "plugins" : [ "wholerow", "checkbox" ]                }).bind("loaded.jstree",function(){                    var node = data.formData.deptCode;                    $("#deptIdModify").jstree("check_node",node);                });

 

 

取值:

var deptIds=$("#deptIdModify").jstree(true).get_selected();

其他知API,详细配置信息 可访问官网：

 jstree 官网:https://www.jstree.com/