bootstrap---treeview使用方法
1、html部分:
<div id="tree"></div>
2、css设置展开/收缩按钮图片:
.tree_arrows_down:before{
content:url("../img/down.png");
}
.tree_arrows_right:before{
content:url("../img/right.png");
}
3、js部分实现:
$('#tree').treeview({
data: treeData,
expandIcon: "tree_arrows_right",
collapseIcon: "tree_arrows_down",
levels : 3,
onhoverColor: "#E8E8E8",
showBorder: false,
showTags: true,
highlightSelected: true,
highlightSearchResults:false,
selectedBackColor: "#8D9CAA",
});
4、数据(treeData)格式:
var treeData =[
{
text: "第一中学",
nodes: [
{
text: "高一年级",
nodes: [
{
text: "一班",
nodes: [
{
text: "三组",//
}
]
}
]
},
{
text: "高二年级",
nodes: [
{
text: "一班",
nodes: [
{
text: "一组",
}
]
}
]
},
{
text: "高三年级",
nodes: []
}
]
}
];
5、样式展现:

bootstrap---treeview使用方法的更多相关文章
- bootstrap的treeview使用方法
首先引入文件: <link href="./css/bootstrap.css" rel="stylesheet"> <script src= ...
- Bootstrap treeview增加或者删除节点
参考(AddNode: http://blog.csdn.net/qq_25628235/article/details/51719917,deleteNode:http://blog.csdn.ne ...
- 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法--(转)
如有雷同,不胜荣幸,若转载,请注明 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了boot ...
- 初始化bootstrap treeview树节点
最近在做启明星图库时,使用了Jquery Bootstrap Treeview插件.但是,遇到了一个初始化的问题.先看效果如下: 当用户打开图库时,左边分类第一个类别是“所有分类”,默认需要选中. ...
- WPF中TreeView.BringIntoView方法的替代方案
原文:WPF中TreeView.BringIntoView方法的替代方案 WPF中TreeView.BringIntoView方法的替代方案 周银辉 WPF中TreeView.BringIntoVie ...
- 转载 JS组件Bootstrap Select2使用方法详解
JS组件Bootstrap Select2使用方法详解 作者:懒得安分 字体:[增加 减小] 类型:转载 时间:2016-01-26我要评论 这篇文章主要为大家介绍了JS组件Bootstrap Sel ...
- 转载------让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
本文是转载及收藏 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在c ...
- Bootstrap Table使用方法详解
http://www.jb51.net/article/89573.htm bootstrap-table使用总结 bootstrap-table是在bootstrap-table的基础上写出来的,专 ...
- bootstrap支持ie8 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
做一个在线系统,PC端也要做,但要兼容千恶的IE8[IE6 是万恶,打死我都不会管IE6],IE8 是我底线了md, 在IE8下 bottstrap 错乱,变形,不支持一些属性的问题,下面看了一篇 某 ...
- 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
首先需要确保你的HTML页面开始部分要有DOCTYPE声明.DOCTYPE告诉浏览器使用什么样的HTML或XHTML规范来解析HTML文档,具体会影响:对标记attributes .propertie ...
随机推荐
- JavaSE(八)之集合练习一
前面把Collection家族给学习完毕了,接下来我们通过几个练习来巩固前面的知识. 一.产生10个1-20之间的随机数要求随机数不能重复 import java.util.HashSet; impo ...
- 【Java学习笔记之八】JavaBean中布尔类型使用注意事项
JavaBean是一个标准,遵循标准的Bean是一个带有属性和getters/setters方法的Java类. JavaBean的定义很简单,但是还有有一些地方需要注意,例如Bean中含有boolea ...
- qsc oj 22 哗啦啦村的刁难(3)(随机数,神题)
哗啦啦村的刁难(3) 发布时间: 2017年2月28日 20:00 最后更新: 2017年2月28日 20:01 时间限制: 1000ms 内存限制: 128M 描述 哗啦啦村作为喵哈哈村 ...
- [图像类名词解释][ RGB YUV HSV相关解释说明]
一.概述 颜色通常用三个独立的属性来描述,三个独立变量综合作用,自然就构成一个空间坐标,这就是颜色空间.但被描述的颜色对象本身是客观的,不同颜色空间只是从不同的角度去衡量同一个对象.颜色空间按照基本机 ...
- 【端-iOS】给iOS开发入门者编码的一点建议
规范编码可以提高代码的可读性,降低维护成本.作为一个程序员,要对自己写的代码负责,虽然bug无可避免,但是写代码时最基本的编码规则还是应该遵守的,否则不是坑自己就是坑别人,因为代码肯定是要维护的. 下 ...
- <input type="text">和<textarea>的区别
在我们开发时经常需要用到输入框,通常解决办法就是<input type="text">和<textarea>,那么这两个标签有什么区别呢? 一:<i ...
- vue-cli脚手架的环境搭建
vue-cli (1)检查node版本 在安装vue的环境之前,安装NodeJS环境是必须的.可以使用node -v指令检查,需要保证安装了4.0版本以上的nodeJS环境. 当然,没有安装的话,去N ...
- tomcat更改端口号
apache-tomcat-8文件下的conf文件下的server.xml文件打开将 <Connector port="8080" protocol="HTT ...
- memcached内存模型
内存管理 内存结构 把内存划分成不同的slab class仓库 把仓库切分成不同尺寸的小块(chunk),用来存储缓存数据 数据内存分配 首先根据数据的大小找到对应的slab class 找到空闲的c ...
- win7彻底卸载iis
https://jingyan.baidu.com/article/e5c39bf5829e8e39d660336c.html 昨天在电脑上搭建了PHP开发环境之后,重启apache服务器老是报错,检 ...