jQuery 下拉列表二级联动插件-白红宇

jQuery 下拉列表二级联动插件

阅读量：6268 次

发布时间：2019-06-22

本文共 1193 字，大约阅读时间需要 3 分钟。

jQuery二级联动插件：jQuery.selected

一个页面可以引用多个联动效果，使用方法：

配置js：

1 var defaults = {
    2     NextSelId: '#Select2',  3     SelTextId: '#Text1',  4     Separator: '--',  5     SelStrSet: [  6         { name: '请选择', subname: '请选择'},  7         { name: '★高起本★', subname: '计算机科学与技术|汉语言文学' },  8         { name: '★高起专★', subname: '语文教育|文秘|学前教育|旅游管理|法律事务|经济管理|会计电算化|电子商务|计算机信息管理|软件工程|机电一体化|精细化学品生产技术|机械制造设计及自动化|播音与主持|艺术设计|书法方向艺术设计' },  9         { name: '★专升本★', subname: '思想政治教育|汉语言文学|英语|数学与应用数学|电子信息工程|计算机科学与技术|会计学|公共事业管理|旅游管理|体育教育|音乐学|艺术设计|书法方向艺术设计'}] 10 } 11 12 var defaults2 = {
   13     NextSelId: '#Select4', 14     SelTextId: '#Text2', 15     Separator: '★', 16     SelStrSet: [ 17         { name: '请选择', subname: '请选择'}, 18         { name: '北京', subname: '北京1|北京2' }, 19         { name: '上海', subname: '上海1|上海2|上海3|上海4' }, 20         { name: '天津', subname: '天津'}] 21 }

　　配置说明：

　　NextSelId：需要联动加载的下拉列表 ID

　　SelTextId：显示选择选项的文本框 ID

　　Separator：一级菜单、二级菜单分割字符串

　　SelStrSet：配置下拉选项

　　　　[{ name: '请选择', subname: '请选择'}]

　　　　　　name：一级下拉选项；subname：二级下拉选项，多个用“|”分开；

html页面：