数据库+javascript+html如何实现多级select下拉菜单

这个，其实比较简单

数据上来说，相当于是一个多维数组

比如，系 ：

    计算机，中文，英语

然后是专业：

    计算机 -> 软件工程，xxx专业 ...

    中文 -> 汉语言文学，xxx专业 ...

数据库在设计上，你可以将他们都放在一个表里面，可以有这些列

id          唯一id

name    名称，可以是专业名称，也可以是系名称

parent  指定如果是专业，是数据那个系，这里可以存成系的id，

            如果是系，那么这里直接填0，表示就可以

这样的话，一个demo数据

id                name                parent

1                计算机系            0

2                软件工程            1

这样，上边，后台的数据就这个节奏就可以满足，如果专业还有细分，那这个结构也可以满足

前台显示的时候，这里分成俩个select来显示就可以

第一个select用来显示系，查询parent为0的数据，显示到select里面就可以

第二个select用来显示系的专业，查询的时候，将第一个select的系id拿到，直接数据库里面查询parent为第一个select选择系的id的数据

demo

选择系：
    
    
选择专业：
    

//用js读取数据，然后生成代码
//根据parentid，读取数据，然后返回
function getData(parentId , callback){
    $.ajax({
        url : 'test.do',//后台数据地址
        data : {parentId : parentId},//请求parentid的数据
        success : function(result){
            alert(result);
            callback(result);
        }
    })
}

function renderOptions(arr , el){//生成select 的 option
    el.empty();
    $.each(data , function(index , item){
        $('').attr({
            value : item.id
        }).html(item.name).appendTo(el);
    })
}

var department = $('#department');//系的select
getData(0 , function(data){//请求系的数据
    department.empty();
    renderOptions(data , department);//这里生成系的select
});

var professional = $('#professional');//专业的select
function change(el){//当系变化的时候
    var parentId = $(el).val();//这里得到选择的系的id
    getData(parentId , function(data){
        professional.empty();
        renderOptions(data , professional );//这里生成专业的select
    });
}

就是这样的原理

后台还需要一个查询，就是根据parentid查询数据，就可以了

这个我给你提供一个思路
先说数据库的设计，系的表就不说了，比如有主键depart_id和depart_name；
然后就是专业的表，major，有个major_id，major_name，最重要的就是还有个depart_id，这是这张表的外键映射系表的主键。
到时候查询就是比如说计算机系的id为1，你就查major表里的depart_id为1的专业就可以了。
至于脚本，这个要用到ajax来进行即时更新的，这个就有很多方法了，用原来的ajax，或者你用封装好的jquery也可以，这个就是网上搜个小例子就OK了。
希望对你有帮助。