效果图：

使用方法

(1)引入框架包，下载地址(2)引入实现版包，下载地址(3)引入tree-select.js(4)$('#id ').treeSelect(数据);

！DOCTYPE html html lang=' en ' hearta charset=' UTF-8 ' title tree select/title script type=' text/JavaScript ' src=' http :/js/jquery-1。11 .0 .量滴js '/脚本链接rel='样式表type=' text/CSS ' href=' js/zTree _ v3-master/CSS/zTree style/zTree style。CSS ' rel='外部无跟随'/脚本类型=' text/JavaScript ' src=' http : js/zTree _ v3-master/js/jquery。z树。全部。js '/script脚本类型=' text/javas$('#ts_input ').treeSelect(数据);});函数getData(){//Ajax get datavar data=[{ ' name ' : '江苏，' pid': 0，' id': -1，//' icon ' : '图像/页面。gif ' }，{'name': '浙江，' pid': 0，' id': -2，//' icon ' : '图像/页面。gif ' }，{'name': '陕西，' pid': 0，' id': -3，//' icon ' : '图像/页面。gif ' }，{'name': '苏州，' pid': -1，' id': 1，//' icon ' : '图像/页面。gif ' }，{'name': '无锡，' pid': -1，' id': 2，//' icon ' : '图像/页面。gif ' }，{'name': '常州，' pid': -1，' id': 3，//' icon ' : '图像/页面。gif ' }，{'name': '杭州，' pid': -2，' id': 4，//' icon ' : '图像/页面。gif ' }，{'name': '宁波，' pid': -2，' id': 5，//' icon ' : '图像/页面。gif ' }，{'name': '西安，' pid': -3，' id': 6，//' icon ' : '图像/页面。gif ' }，{'name': '宝鸡，' pid': -3，' id': 7，//' icon ' : '图像/页面。gif ' }，{'name': '咸阳、PID :-3、id :-4、//、图标：图像/页面。gif"}、{"name":秦都，' pid': -4，' id': 9，//' icon ' : '图像/页面。gif ' }，{'name': '杨凌、PID :-4、id :-5、//、图标：图像/页面。gif"}、{"name":树木园，' pid': -5，' id': 1，//' icon ' : '图像/页面。gif ' }，{'name': '渭河，' pid': -5，' id': 2，//' icon ' : '图像/页面。gif ' }，]；返回数据；}/脚本总结

以上所述是小编给大家介绍的框架多级树形下拉菜单的实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！