# treeSelect
**Repository Path**: molink/treeSelect
## Basic Information
- **Project Name**: treeSelect
- **Description**: TreeSelect是基于jquery,ztree开发的树形下拉选择框插件，支持ie8+,谷歌，火狐，360等浏览器
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 25
- **Created**: 2020-03-21
- **Last Updated**: 2020-12-19
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
### jquery 树形下拉框插件
TreeSelect,ztree开发的树形下拉选择框插件，支持ie8+,谷歌，火狐，360等浏览器
现在升级2.0名字由原来的 _**MultipleTreeSelect改为TreeSelect.js**_
api更加丰富。结构更加清晰
#### TreeSelect有如下主要特点
- 兼容ie8以及各大主流浏览器
- 低侵入式使用
- 使用简单方便
- 继承了ztree高效渲染
**TreeSelect 欢迎使用本插件: TreeSelect**
#### 多选示例图片：
#### 单选选示例图片
#### 快速上手示例
**1. 引入jquery,ztree,TreeSelect等js和css文件**
```html
$Title$
```
**2.异步加载配置实例**
```js
var options = {
async: {
enable: true,
url: "http://qqxh.net"
}
}
```
**3.配置文件详解**
```js
var options = {
async: {
enable: true,
url: "异步加载url地址"
},
chkStyle: "radio",/*radio：单选模式(Radio mode)，checkbox：多选模式(checkbox mode)，默认为多选*/
radioType : "all",/*all：整个树只能有一个选中，level：在每一级节点范围内当做一个分组*/
height:433,/*容器高度默认200px*/
callback:{
onCheck: function() {}/*选中事件的回调*/
},
direction: "auto",/* up向上,down向下,auto自动适应 默认auto*/
filter:true/* 是否开启过滤 默认true*/
}
```
**4.api列表**
- 获取选中文本
```js
var obj=$("#yourContentId").treeSelect(options);（如果这里jquery选择器获取到多个元素，那么这里返回的是TreeSelect对象列表）
obj.text();
```
- 获取选中值
```js
var obj=$("#yourContentId").treeSelect(options);
obj.val();
```
- js给组件赋值
```js
var obj=$("#yourContentId").treeSelect(options);
obj.val([1,2,3,4,5,6,7]);
```
- 默认选中值
方式1：
通过给dom元素设置属性checks来进行设置，格式为:checks="1,2,3,4,5"
例如：
```
```
方式2：
通过optios配置实现配置项为：checks
例如：
```
$("#yourContentId").treeSelect({checks:[1,2,3],.....});
```
- 销毁组件
方式1：
通过destory方法进行销毁
例如：
```
var obj=$("#yourContentId").treeSelect(options);
obj.destory();
```
### 注意事项:
检索功能只支持前端检索，也就是说想使用异步模式的话，需要一次把树节点加载完全然后检索才有意义。配合异步后台检索暂时不考虑实现。
TreeSelect 开发者网站:http://www.qqxh.net