级联下拉框动态加载数据

下拉框级联效果图：

 

JS代码：

            + 、- 号事件

           /**
             * 加号或减号事件
             * @param {Object} e
             */
            function changeDiv(e) {
                var ee = $(e);
                var parent = ee.parent();
                var name = ee.attr('name');
                var t = name.substring(1);
                var html = ee.html();
                var content = $('.accessMall').html();
                if (html == '+') {
                    //+
                    $('.accessMall').append('
--请选择--  --请选择--+
');
                    $('select[name="select' + (num - 1) + '"]').empty();
                    $('i[name="i' + (num / 2 - 1) + '"]').html('-');
                    $('select[name="select1"] option').each(function () {
                        var html = $(this).html();
                        var value = $(this).val();
                        $('select[name="select' + (num - 1) + '"]').append("" + html + "");
                    })
                    $("select[name^='select']").selectpicker('refresh');
                } else {
                    //-
                    parent.empty();
                }
            }

            /**
             * 减号事件（旧数据）
             * @param {Object} e
             */
            function changeDivOld(e) {
                var ee = $(e);
                var parent = ee.parent();
                parent.empty();
            }

div:

            

                                                    
                                                    
                                                    活动商场：
                                                    

                                                         按区域
                                                         按城市
                                                        


                                                        

                                                        
                                                        

                                                            

                                                                
                                                                    --请选择--
                                                                  
                                                                
                                                                    --请选择--
                                                                
                                                                +
                                                            
                                                        
                                                        
                                                    
                                                

至于回显的数据无非是调用后台的方法，这里就不再赘述了。

思路：1.radio按钮为一个触发事件 （点击城市，加载第一下拉框数据为省份；点击区域，加载第一个下拉框数据为区域）。

           2. 点击第一下拉框触发事件（如果是省份去加载第二个下拉框对应的城市信息，如果是区域，加载第二个下拉框中对应的区域信息）。