级联下拉框

下文中所使用的 testData 数据如下：

初始展示：

通过监听实例的 onChanged 方法可获取每次下拉框的 change 后的值

var chainSelect = new ChainSelect({
  el: '#type',
  data: testData
});
chainSelect.onChanged(function(value, curData, $select) {
  // value 当前下拉框的值
  // $select 当前下拉框 jquery 对象
  console.log(value, curData, $select)
});

自定义样式： class="form-control input-sm"

可以为初始的 select 设置好样式，后续生成的 select 会继承其样式

new ChainSelect({
  el: '#type1',
  data: testData
});

初始化赋值：

通过设置 values 属性来初始化赋值

  new ChainSelect({
    el: '#type2',
    values: ['component', 'basic', 'icon', 'svg'],  // 依次为各个下拉框的值			
    data: testData
  });

通过 js 赋值：

使用 setValues 方法来动态赋值

var select = new ChainSelect({
  el: '#type3',
  data: testData
});

// js 赋值
$('.btn-primary').click(function() {
  select.setValues(['guide', 'daohang', 'dingbudaohang']);
});

去看看自定义字段名

去看看大数据(上万个节点)