bootstrap treeview全选和全不选API

最新推荐文章于 2024-05-10 09:49:25 发布
最新推荐文章于 2024-05-10 09:49:25 发布
阅读量1k 收藏
点赞数
分类专栏： 前端js 文章标签： bootstrap treeview
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39095118/article/details/83860555
版权

在前端上用treeview做个很简单的全选和取消的功能，结果上网查了好一会，很多都是复杂的父子节点的选择，简单的自己记一下
全选

$('#Tree').treeview('checkAll', { silent: true });

取消所有选择

$('#Tree').treeview('uncheckAll', { silent: true});

本来找不到取消全选准备遍历一下所有选中的然后用uncheckNode方法改变状态，然而发现好像这个方法不会生效，这点有解决的麻烦评论告诉我下

TeRiRi
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
bootstrap插件treeview实现全选父节点下所有子节点和反选功能
08-29
主要为大家详细介绍了bootstrap插件treeview实现全选父节点下所有子节点、反选功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
bootstrap TreeView全选单选，定位选触发事件实例
09-12
本实例完成了bootstrap TreeView的各种选择的事件触发，选中后打印出树节点的相关信息，包括单选，全选，父级和定位
推荐：Bootstrap Tree View - 极简优雅的树形视图组件
最新发布
gitblog_00032的博客
05-10 334
推荐：Bootstrap Tree View - 极简优雅的树形视图组件 项目地址:https://gitcode.com/jonmiles/bootstrap-treeview Bootstrap Tree View 是一个基于 Twitter Bootstrap 框架的强大树形结构展示插件。它提供了简单易用的API，让你能够轻松地在网页中呈现复杂的层级数据。此项目不仅具备良好的社区支持和持续更...
bootstrap treeview 自定义全选 / 全部取消选中
weixin_33854644的博客
07-11 2164
bootstrap treeview默认不提供全选 / 全部取消操作, 需要开发者自定义. 自定义效果如下, 点击父节点, 子节点全部选中, 再次点击, 子节点全部取消选中. 在笔者的情况下, 需要实现父节点的单独选中, 所以这里做了子节点全部不选中的情况下, 依然保持父节点单独选中状态. html代码如下: <div id="modal-...
bootstrap树 bootstrap-treeview完整例子
09-02
强烈建议初次使用bootstrap的人参考，例子很全 bootstrap树控件使用bootstrap-treeview.js实现树前边多选框checkbox 并实现， 0、获取选中的项 1、点击父级的多选框，自己默认选中 2、全选 3、反选 4、展开、 5、折叠
TreeView只能选中一个节点
weixin_30512785的博客
09-25 676
让TreeView的所有节点包括父节点和子节点，有且仅有一个能被选中： private void checkAllNodes(TreeNode pNode,bool nodeChecked,TreeNodeCollection col) { if (nodeChecked == true) {...
bootstrap-treeview史上最强例子
07-08
强烈建议初次使用bootstrap的人参考，例子很全...bootstrap树控件使用bootstrap-treeview.js实现树前边多选框checkbox 并实现， 0、获取选中的项 1、点击父级的多选框，自己默认选中 2、全选 3、反选 4、展开、 5、折叠
bootstrap-treeview怎么控制单选
qq_38577700的博客
01-06 718
废话不多说直接上代码 /生成模态框的路口卡口树 function getModalBayonetTree(contener) { var nodeId_temp = null; $.ajax({ url : ext.urlPath.apiUrl.getLaiZhouBayonetTree, type : 'get', dataTyp...
bootstrap-treeview
xiaoyushiying的专栏
07-28 5680
bootstrap-treeview 简要教程 bootstrap-treeview是一款效果非常酷的基于bootstrap的jQuery多级列表树插件。该jQuery插件基于Twitter Bootstrap，以简单和优雅的方式来显示一些继承树结构，如视图树、列表树等等。  插件依赖 Bootstrap v3.0.3jQuery v2.0.3 以上两
bootstrap-treeview 获得所有选中id
b229911288的博客
01-19 1万+
$('#main_json').treeview('getChecked')；此方法官方文档没有，是在源码中查找到的
bootstrap-treeview.js的高级使用
ruoshui1748的博客
09-19 1万+
支持全选，反选，以及自动选择某节点以及其下面的所有子节点 {load href="__CSS__/plugins/treeview/bootstrap-treeview.css" /} {load href="__JS__/plugins/treeview/bootstrap-treeview.js" /} $(functi
bootstarp treeview 获取勾选和获取Selected选中
热门推荐
师远鹏
08-16 2万+
在用treeview的时候，经常会遇到一些官网没有详细说明的东西，比如获取勾选和获取选中的方法，获取选中官网是有明显说明的， 如下  $('#resourceTree').treeview('getSelected'); 但是有时候想获取前面复选框勾选的，如下 $('#resourceTree').treeview('getChecked'); 这里再说一下t
bootstrap-treeview的完善（父子节点的全选与反选)以及使用的方法
taodfhkdn的博客
09-25 385
// 选中父节点时，选中所有子节点 function getChildNodeIdArr(node) { var ts = []; if (node.nodes) { for (x in node.nodes) { ts.push(node.nodes[x].nodeId);...
bootstrap-treeview 如何实现全选父节点下所有子节点及反选
dianzudi1839的博客
07-21 291
转（https://www.augsky.com/992.html） 选中父节点时，父节点下所有子节点也都全部选中 1，HTML代码 1 <h2>TreeView Checkable</h2> 2 <div id="treeview-checkable"></div> 2，Js...
关于bootstrap  treeview中 选中某一节点，自动选中其所有父级节点的问题
RichardDragon的博客
04-09 1820
关于bootstrap treeview中 选中某一节点，自动选中其所有父级节点的问题 最近在项目中一直用到树结构比较多，自然的各种奇葩要求都会遇到，也会有各种天马行空的想法，这应该是好的。下面是bootstrap的一个treeview结构中遇到了一个要求，如题目所说，要求选中某一个节点时，自动选中其所有父级节点： 要求：选中5时，自动选中其上级的4、3、2、1。 在网上找过一...
js全选按钮
06-02
实现JS全选按钮的基本思路是：通过监听全选按钮的点击事件，来改变其他复选框的选中状态。以下是一个简单的实现方法： HTML代码： ``` <input type="checkbox" id="select-all"> 全选 <input type="checkbox" class="checkbox-item"> 选项1 <input type="checkbox" class="checkbox-item"> 选项2 <input type="checkbox" class="checkbox-item"> 选项3 ``` JS代码： ``` // 获取全选按钮和每个复选框 var selectAll = document.getElementById('select-all'); var checkBoxes = document.getElementsByClassName('checkbox-item'); // 给全选按钮添加点击事件监听器 selectAll.addEventListener('click', function() { // 遍历每个复选框，将它们的选中状态改为全选按钮的状态 for (var i = 0; i < checkBoxes.length; i++) { checkBoxes[i].checked = selectAll.checked; } }); ``` 在上述代码中，我们首先通过 `getElementById` 方法获取了全选按钮，然后通过 `getElementsByClassName` 方法获取了所有的复选框。接下来，我们给全选按钮添加了一个点击事件监听器，当全选按钮被点击时，我们遍历所有的复选框，将它们的选中状态改为全选按钮的状态。这样，当用户点击全选按钮时，所有的复选框都会被选中，当用户取消全选时，所有的复选框都会取消选中。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值