基于bootstrap-treeview做的一个漂亮的无限分类树层级联动菜单

2017年12月11日09:59:15

因为工作需要把原来的bootstrap-treeview做了一些小改动,方便后台开发人员使用

最终效果,看起来还行,但是其实不是特别友好对用户来说,但是对开发者人员来说足够了

"after_html": "<span class=\"button_z\"><button type=\"button\" class=\"btn btn btn-info btn-xs\" onclick=\"edit(14);\">编辑</button>&nbsp;&nbsp;&nbsp;&nbsp;<button type=\"button\" class=\"btn btn-danger btn-xs\" onclick=\"del(14);\">删除</button></span>"
此方法是我新加的,方便用户定义自己需要的html

新增加属性 ,此方法一定要配置css调控按钮位置

你可以参照此方法,新增自己需要定义的html,直接copy换个名字可以,需要在定义的

        after_html: ‘‘,
        showAfterHtml: false,
            //额外增加,一些html
            if (_this.options.showAfterHtml && node.after_html) {
                treeItem
                        .after(node.after_html);
            } else {
                treeItem
                        .after(node.after_html);
            }

完全可以仿照参考自定义编写

新增 自动层级联动

全部取消和选中,原版的就有方法,请查看文档

下载地址在QQ群,你也可以去jq22下载

时间: 2024-12-12 03:20:19

基于bootstrap-treeview做的一个漂亮的无限分类树层级联动菜单的相关文章

做了一个漂亮的项目,啧啧

选择android的缘由 我叫刘**,来自黑龙江省哈尔滨市,在学习安卓之前做过一段时间的web前端,但总感觉不是自己未来的方向,这两年移动互联网行业的大力发展,我仿佛间看到了这才是我未来要找寻的路,在半年前,我开始自学安卓.主要学安卓还是因为开源和市场的巨大,通过在网站了解和朋友的了解,根据我自身的情况,0基础的课程我肯定是不会选择的,因为不适合我,所以我选择好程序员班,很适合我这种有一定基础的人.于是乎我来到了这里,在这期间我反复对比了下各机构的课程大纲,只有这边的课程深度是最让我满意的.也是

基于Linq表达式做的一个简单的表达式生成器

using System; using System.Collections.Generic; using System.ComponentModel.DataAnnotations.Schema; using System.Linq; using System.Linq.Expressions; namespace Model { [NotMapped] public class FilterInfo { /// <summary> /// 字段名称 /// </summary>

php部分,一个用递归无限分类的方法

<?php $data[]=array('id'=>1,'parentid'=>0,'name'=>'中国'); $data[]=array('id'=>2,'parentid'=>0,'name'=>'美国'); $data[]=array('id'=>3,'parentid'=>0,'name'=>'韩国'); $data[]=array('id'=>4,'parentid'=>1,'name'=>'北京'); $data[

原创《开源一个用 vue 写的树层级组件 vue-ztree》

最近由于后台管理项目的需要,页面需要制作一个无限树的需求,我第一想到了插件 ztree,不过我觉得它太大了,还是自己主动丰衣足食吧. ztree 的 demo 地址:http://www.treejs.cn/v3/demo.php 我拿来了 ztree的样式库,自己动手写的算法,整了一个小而美的 vue-ztree  组件,它基本上能满足我的业务需求,我也希望造福开源社区,打算把它开源了. 概要 : 1: vue-ztree 的效果图 2: vue-ztree 的调用方式 3: vue-ztre

基于Bootstrap的JQuery TreeView树形控件,数据支持json字符串、list集合(MVC5)

BZ第一次自己写博客,心情好激动!!BZ也是小菜,本文如果有什么不对的地方,希望大神们多多指教,也希望和我一样的小菜多多学习.BZ在这里谢过各位. BZ最近看了很多博友的有关TreeView的博客,发现很多都是WebForm.JQuery的.因为BZ使用的是MVC的原因,所以决定写一写关于MVC和Bootstrap的TreeView. PS:基于Bootstrap的JQuery TreeView树形控件,JQuery版本为2.1.1(下载网上的基于Bootstrap的JQuery TreeVie

bootstrap做了一个表格

花了一下午做了一个表格: 大致是这样: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>广发互联小贷</title> <meta name="keywords" content="广发互联小贷" /> <meta name="description" co

一个基于bootstrap的菜单

原文:一个基于bootstrap的菜单 源代码下载地址:http://www.zuidaima.com/share/1550463638506496.htm 效果如下:

一个基于Bootstrap实现的HMTL可视化编辑工具

疫情禁足在家,用原生的JS实现了一个HTML可视化编辑工具,页面布局基于Bootstrap.大约一个月时间,打通主要技术关卡,实现了第一版: 可以拖放编辑,实现了几乎所有的bootstrap预定义工具类. 设计时,尽量让其可以灵活扩展,支持多主题切换,为自定义控件预留了接口. 还可以作为bootstrap学的辅助工具,在界面上选好配置,可以把相应的class全部显示出来,所见即所得. 后期的主要实现方向: 1.增加尽量多的主题,形成一个主题库 2.结合国内微信使用状况,增加可以微信分享的H5模板

【细解】如何基于bootstrap创建一个响应式的导航条

本地下载 最终实现效果如下: 首先你得引入bootstrap与jquery 推荐一个CDN:http://cdn.gbtags.com/index.html 然后就是开始编写HTML代码.如果你不想更改显示效果的话实际上CSS都免去写了2333 因为HTML代码比较多 这里分为三个部分 然后最后再上一份整体HTML代码 首先如上图所示的,实现这个效果需要了解bootstrap的以下几个组件 导航条 按钮 表单 下拉菜单 实际上以上几个组件的样式有很多.我们只需要了解一部分即可 如需了解更多的请转