jstree单选功能的实现方法


Posted in Javascript onJune 07, 2017

在选择部门时,因为每个人只有一个部门,因此要实现单选。

在jstree的core里加入 “multiple”: false,

注意是写在core

如下所示

'plugins': ["wholerow", "checkbox", "types"],
'core': {
    "multiple": false,//单选
    "themes": {
       "responsive": false
    },

如果只选择子节点的话,这样实现是没有问题的。

jstree单选功能的实现方法

注意:如果选择父节点的话,还是会选中下面的子节点

jstree单选功能的实现方法

如果想选择父节点时不全选子节点,就需要加上下面这句

"checkbox": {
        "three_state": false
      },

注意这个是和plugins,core平级的

'plugins': ["wholerow", "checkbox", "types"],
'checkbox': {
     "three_state": false//父子级不关联选中
 },
'core': {
   "multiple": false,//单选
   "themes": {
   "responsive": false
 },

效果如下:

jstree单选功能的实现方法

这是可以看到选中了父节点,子节点已经不会选中了。

Javascript 相关文章推荐
前台js调用后台方法示例
Dec 02 Javascript
jQuery 顶部导航跟随滚动条滚动固定浮动在顶部
Jun 06 Javascript
表单验证正则表达式实例代码详解
Nov 09 Javascript
基于jQuery实现返回顶部实例代码
Jan 01 Javascript
深入浅析JavaScript中的3DES
Aug 24 Javascript
JS返回只包含数字类型的数组实例分析
Dec 16 Javascript
vue2.0 中使用transition实现动画效果使用心得
Aug 13 Javascript
从零使用TypeScript开发项目打包发布到npm
Feb 14 Javascript
es6函数之rest参数用法实例分析
Apr 18 Javascript
如何在vue中使用jointjs过程解析
May 29 Javascript
在react-antd中弹出层form内容传递给父组件的操作
Oct 24 Javascript
antd中table展开行默认展示,且不需要前边的加号操作
Nov 02 Javascript
JQueryMiniUI按照时间进行查询的实现方法
Jun 07 #jQuery
webpack打包单页面如何引用的js
Jun 07 #Javascript
vue使用Axios做ajax请求详解
Jun 07 #Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 #Javascript
关于vue.js v-bind 的一些理解和思考
Jun 06 #Javascript
详解vue-cli开发环境跨域问题解决方案
Jun 06 #Javascript
JS实现微信里判断页面是否被分享成功的方法
Jun 06 #Javascript
You might like
别人整理的服务器变量:$_SERVER
2006/10/20 PHP
phpfans留言版用到的install.php
2007/01/04 PHP
input file获得文件根目录简单实现
2013/04/26 PHP
对PHP新手的一些建议(PHP学习经验总结)
2014/08/20 PHP
PIGCMS 如何关闭聊天机器人
2015/02/12 PHP
memcache一致性hash的php实现方法
2015/03/05 PHP
Laravel路由设定和子路由设定实例分析
2016/03/30 PHP
基于jquery的网页SELECT下拉框美化代码
2010/10/28 Javascript
js动态给table添加/删除tr的方法
2013/08/02 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
2014/11/24 Javascript
jquery通过ajax加载一段文本内容的方法
2015/01/15 Javascript
jQuery获得指定元素坐标的方法
2015/04/14 Javascript
详解AngularJS的通信机制
2015/06/18 Javascript
JavaScript的函数式编程基础指南
2016/03/19 Javascript
Bootstrap的class样式小结
2016/12/01 Javascript
jQuery实现字符串全部替换的方法
2016/12/12 Javascript
微信小程序实现传参数的几种方法示例
2018/01/10 Javascript
微信小程序获取用户信息并保存登录状态详解
2019/05/10 Javascript
vue 插槽简介及使用示例
2020/11/19 Vue.js
python3使用urllib示例取googletranslate(谷歌翻译)
2014/01/23 Python
python输出指定月份日历的方法
2015/04/23 Python
Tensorflow卷积神经网络实例进阶
2018/05/24 Python
PyCharm代码回滚,恢复历史版本的解决方法
2018/10/22 Python
Python 实现一行输入多个数字(用空格隔开)
2020/04/29 Python
keras中epoch,batch,loss,val_loss用法说明
2020/07/02 Python
python 多线程中join()的作用
2020/10/29 Python
Python 利用flask搭建一个共享服务器的步骤
2020/12/05 Python
利用css3制作3D样式按钮实现代码
2013/03/18 HTML / CSS
纯CSS3实现漂亮的input输入框动画样式库(Text input love)
2018/12/29 HTML / CSS
比利时买床:Beter Bed
2017/12/06 全球购物
智能旅行箱:Horizn Studios
2018/04/30 全球购物
师德个人剖析材料
2014/02/02 职场文书
信息工作经验交流材料
2014/05/28 职场文书
青春飞扬演讲稿
2014/09/11 职场文书
门店店长岗位职责
2015/04/14 职场文书
css3 利用transform-origin 实现圆点分布在大圆上布局及旋转特效
2021/04/29 HTML / CSS