Ajax实现 下拉列表联动
目标:利用Ajax从数据库取出数据,实现下拉列表联动。
工具/原料
Eclipse
原理
1、第一个下拉列表是由用户想action发送请求,直接将数据库内容发送到页面,一级下拉列表进行畛粳棠奈获取。第二个下拉列表则需要触发第一个下拉列表的onchange事件,利用Ajax向action请求数据!
表设计
1、数据库里面建立两张表,一张表是一级下拉列表,另外一张是二级下拉列表,同时二级下拉列表需要引用一级下拉列表的ID,如下图所示:


Ajax设计
1、创建XMLHttpRequest对象,如下图所示:

3、回调函数,如下图所示:注意需要献皲咝犴删除一个元素,因为action里面是以空格连接下拉列表的各项的,最后一个需要删除,否则下拉列表会多出一个空项。

2、根据一级下拉列表的id请求二级下拉列表,注意空格,如下图所示:

XML设计
1、没什么好说的,上图:

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
阅读量:35
阅读量:94
阅读量:51
阅读量:47
阅读量:66