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 遮照层实现代码
Mar 31 Javascript
jquery弹出关闭遮罩层实例
Aug 06 Javascript
js实现最短的XML格式化工具实例
Mar 12 Javascript
jquery实现漂亮的二级下拉菜单代码
Aug 26 Javascript
React创建组件的三种方式及其区别
Jan 12 Javascript
JavaScript数据结构中栈的应用之表达式求值问题详解
Apr 11 Javascript
详解JS中的this、apply、call、bind(经典面试题)
Sep 19 Javascript
webstrom Debug 调试vue项目的方法步骤
Jul 17 Javascript
vue系列之requireJs中引入vue-router的方法
Jul 18 Javascript
详解vue引入子组件方法
Feb 12 Javascript
vue中使用props传值的方法
May 08 Javascript
maptalks+three.js+vue webpack实现二维地图上贴三维模型操作
Aug 10 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
AMFPHP php远程调用(RPC, Remote Procedure Call)工具 快速入门教程
2010/05/10 PHP
php输出表格的实现代码(修正版)
2010/12/29 PHP
一个php生成16位随机数的代码(两种方法)
2014/09/16 PHP
PHP输出两个数字中间有多少个回文数的方法
2015/03/23 PHP
PHP 中 DOMDocument保存xml时中文出现乱码问题的解决方案
2016/09/19 PHP
深入理解Yii2.0乐观锁与悲观锁的原理与使用
2017/07/26 PHP
jQuery Ajax之load()方法
2009/10/12 Javascript
xml文档转换工具,附图表例子(hta)
2010/11/17 Javascript
用JS做的简单的可折叠的两级树形菜单
2013/09/21 Javascript
js的正则test,match,exec详细解析
2014/01/29 Javascript
基于Vue.js的表格分页组件
2016/05/22 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
2016/06/17 Javascript
Bootstrap表单控件使用方法详解
2017/01/11 Javascript
基于js的变量提升和函数提升(详解)
2017/09/17 Javascript
使用 Node.js 模拟滑动拼图验证码操作的示例代码
2017/11/02 Javascript
基于jquery的on和click的区别详解
2018/01/15 jQuery
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
AngularJS下$http服务Post方法传递json参数的实例
2018/03/29 Javascript
el-select数据过多懒加载的解决(loadmore)
2019/05/29 Javascript
微信小程序之几种常见的弹框提示信息实现详解
2019/07/11 Javascript
深入了解Hybrid App技术的相关知识
2019/07/17 Javascript
JS实现TITLE悬停长久显示效果完整示例
2020/02/11 Javascript
vue+Element中table表格实现可编辑(select下拉框)
2020/05/21 Javascript
python+mysql实现简单的web程序
2014/09/11 Python
Python中的一些陷阱与技巧小结
2015/07/10 Python
基于Python的ModbusTCP客户端实现详解
2019/07/13 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
win10环境下配置vscode python开发环境的教程详解
2019/10/16 Python
Python %r和%s区别代码实例解析
2020/04/03 Python
CSS3制作气泡对话框的实例教程
2016/05/10 HTML / CSS
雪花秀美国官方网站:韩国著名草本护肤化妆品品牌
2016/10/19 全球购物
美国羊皮公司:Overland
2018/01/15 全球购物
大学生怎样进行自我评价
2013/12/07 职场文书
人力资源作业细则
2014/03/03 职场文书
小学绿色学校申报材料
2014/08/23 职场文书
2014年小学工作总结
2014/11/26 职场文书