JQuery+Ajax实现下拉框联动（省市联动）

    近日在项目中碰见下拉框联动的问题，要求异步刷新，百度了好多，虽然讲的很详细，但是对于初级的我来说，使用起来还是有难度，一下提供几个别人的纯jQuery实现的省市联动：

http://www.helloweba.com/view-blog-188.html

http://www.jb51.net/article/41619.htm

    因为本人刚接触jQuery，对使用还不是很到位，所以就根据自己的想法写了一个下拉框联动的实例，分享出来，方法比较简单和低级， 仅供初学者参考。

 

    项目说明：采用的springMVC+hibernate框架

    首先是需求： 项目要求在新增页面中添加下拉联动，（点击数据源，显示对应可供选择的主表信息列表），如图：

 

 

    思路：首先，将数据源信息，在controller中全部查寻到，并且返回到页面中，这样，一开始，第一级下拉列表（数据源），然后在数据源下拉框中增加 onchange()事件，在onchange()事件中拼出 上图，主表名称 的下拉菜单。

程序实现：

    第一步：查询到一级下拉框所需的值。并返回页面。

    第二步：在页面中取值，并且向一级下拉框增加， onchange()事件，

 

    需要注意的是， 一级下拉有值，但是二级下拉为一个空的 <select></select>标签

    第三步：在onchange()方法中，拼出二级下拉菜单

 

 

    第四步：在controller中 得到并组织二级下拉菜单（实例中为：主表名）数据。

    第五步：运行结果

    总结：由于本项目是建立在springMVC+hibernate 框架下的，有些方法是封装的，可能无法展示，总之，思路就是这样，可能有些 繁琐，有些复杂， 但是 功能实现了。 初学者可以借鉴。 等以后 jQuery用的熟练了，回过头来再进行修改。

转载于:https://my.oschina.net/xwk0410/blog/688273