解决Jstree 选中父节点时被禁用的子节点也会选中的问题

2024-12-12 05:01:26

问题描述：

最近用jstree遇到一个问题，父节点选中时，被禁用的子节点也会选中如下

解决方案：

1、将jstree升级到最新的版本，v3.3.4及以上就可以

2、修改checkbox插件配置，将cascade_to_disabled设置为false（注：需要将配置脚本放jstree.min.js的后面）

<script src="./../../dist/jstree.min.js"></script>
<script>
$.jstree.defaults.checkbox = {
      visible: true,
      three_state: true,
      whole_node: true,
      keep_selected_style: true,
      cascade: '',
      tie_selection: true,
      /**
      * This setting controls if cascading down affects disabled checkboxes
      * @name $.jstree.defaults.checkbox.cascade_to_disabled
      * @plugin checkbox
      */
      cascade_to_disabled : false,
      cascade_to_hidden : true
};

$('#data').jstree({
    'core' : {
      'data' : [
        { "text" : "Root node", "children" : [
            { "text" : "Child node 1", "state": { "disabled": true } },
            { "text" : "Child node 2" },
            { "text" : "Child node 3" },
            { "text" : "Child node 4" },
            { "text" : "Child node 5" },
            { "text" : "Child node 6" }
        ]}
      ]
    }
    ,"plugins" : [ "checkbox" ]
  });
</script>

修改后当选中父节点时，子节点会跳过禁用子节点如下：

以上这篇解决Jstree 选中父节点时被禁用的子节点也会选中的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

解决Jstree 选中父节点时被禁用的子节点也会选中的问题

问题描述: 最近用jstree遇到一个问题,父节点选中时,被禁用的子节点也会选中如下解决方案: 1. 将jstree升级到最新的版本,v3.3.4及以上就可以 2. 修改checkbox插件配置,将cascade_to_disabled设置为false(注:需要将配置脚本放jstree.min.js的后面) <script src="./../../dist/jstree.min.js"></script> <script> $.jstree.de
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题

最近学习vuejs看例子中用$on无法监听子组件$emit触发事件: 使用版本 vue.js 2.2.5 参考文献 1.vuejs API 2.解决实例问题分析 1.之前写的自定义组件事件触发为this.$emit("myclick",this.todo.text);,这样this指的是todo-item的每一项,而最后vm.$on监听的是app组件,也就出说监听的是父节点,而触发的是子节点,故监听不到这个事件的. 解决思路 1.将触发事件放在父节点上触发,就可以监听到触发的事件了,
MySql利用父id递归向下查询子节点的方法实例

不用写存储过程,不用建数据库函数,一段sql就可以实现不用写存储过程,不用建数据库函数,一段sql就可以实现不用写存储过程,不用建数据库函数,一段sql就可以实现 SELECT ID.LEVEL, DATA.* FROM ( SELECT @ids AS _ids, ( SELECT @ids := GROUP_CONCAT( region_id ) FROM region WHERE FIND_IN_SET(parent_id, @ids ) ) AS cids, @l := @l + 1
关于extjs treepanel复选框选中父节点与子节点的问题

extjs 如图,实现带有复选框的树,选中父节点时,选中所有子节点.取消所有子节点时,才能取消根节点. 复制代码代码如下: var Fpanel = new Ext.tree.TreePanel({ id:'ptree', region:'west', layout:'anchor', border:false, rootVisible: false, root:new Ext.tree.AsyncTreeNode({}), listeners:{ "checkchange": f
zTree获取当前节点的下一级子节点数实例

使用zTree插件实现树形图中,需要获取当前点击的父节点的子节点数的需求,使用treeNode.children获取子节点数据集合,使用length方法获取集合长度. 将当前节点的treeNode传入即可调用. /*查找当前节点下一级的子节点数*/ function findNodes(treeNode) { var count; /*判断是不是父节点,是的话找出子节点个数,加一是为了给新增节点*/ if(treeNode.isParent) { count = treeNode.childre
jQuery插件zTree实现删除树子节点的方法示例

本文实例讲述了jQuery插件zTree实现删除树子节点的方法.分享给大家供大家参考,具体如下: 1.实现代码: <!DOCTYPE html> <html> <head> <title>zTree实现基本树</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="
vue源码解读子节点优化更新

目录前言优化前存在的问题优化策略分析源码解析小结前言 Vue中更新节点,当新 VNode 和旧 VNode 都是元素节点且都有子节点时,Vue会循环对比新旧 VNode 的子节点数组,然后根据不同情况做不同处理. 虽然这种方法能解决问题,但是当更新子节点特别多时,循环算法的时间复杂度就会很高,所以Vue对此进行了优化. 优化前存在的问题现在有新的 newChildren 数组和旧的 oldChildren 数组: newChildren = ['a','b','c','d']; o
使用dom4j递归解析节点内还含有多个节点的xml

目录 dom4j递归解析节点内还含有多个节点的xml 介绍了dom4j的一些平常使用下面是main方法以及两个解析方法 dom4j递归解析XML字符串所有子节点 dom4j递归解析节点内还含有多个节点的xml 介绍了dom4j的一些平常使用 dom4j的介绍: dom4j是一个Java的XML API,是jdom的升级品,用来读写XML文件的.dom4j是一个十分优秀的JavaXML API,具有性能优异.功能强大和极其易使用的特点,它的性能超过sun公司官方的dom技术,同时它也是一个开放源
ztree获取选中节点时不能进入可视区域出现BUG如何解决

zTree 是一个依靠 jQuery 实现的多功能 "树插件".优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. zTree 的特点编辑 ● zTree v3.0 将核心代码按照功能进行了分割,不需要的代码可以不用加载 ● 采用了延迟加载技术,上万节点轻松加载,即使在 IE6 下也能基本做到秒杀 ● 兼容 IE.FireFox.Chrome.Opera.Safari 等浏览器 ● 支持 JSON 数据 ● 支持静态和 Ajax 异步加载节点数据 ● 支持任意更换皮肤 /
element-ui中实现tree子节点部分选中时父节点也选中

目录子节点部分选中时父节点也选中 el-tree数据回显时子节点部分选中,父节点都全选中的坑我这里用getNode()的方法来简单解决子节点部分选中时父节点也选中如果需求是:选中任何一个子节点都默认选择父节点,怎么办? 其实,element-ui也提供了方案,常规下,如果子节点选中,那么这时父节点是半选中状态,在获取选中值时,只需要利用**getHalfCheckedKeys()+getCheckedKeys()**两个方法即可达到效果. let zi = this.$refs.tre

解决Jstree 选中父节点时被禁用的子节点也会选中的问题

相关推荐

随机推荐