首先，看一下下下面的<DIV>元素

----------------------------------

<div class="filter">
   <span class="floatL sp_name">平台类型：</span>
    <?php echo select($pt_type_group,(isset($pt_moren)) ? intval($pt_moren) : 'null', 'onchange="ldone()" name="type_role" id="roleval" class="floatL select_2" style="width:85px;"');?>
 </div>

----------------------------------

<div class="filter">
    <span class="floatL sp_name">用户组：</span>
    <select id="se1" onchange="ldtwo()" name="info[type_id]" id="roleid" class="floatL select_2" style="width:85px;">
    </select>
</div>

在第一个div里有个下拉列表，PS:这个下拉列表是公司技术大牛自己封装的方法，在下拉列表select标签元素中，设置ID属性"roleval"，并声明创建一个点击改变事件"onchange=函数名()"

点击效果为，点击第一个下拉列表，选中下拉列表中的值，第二个DIV中的下拉列表异步获取有后台PHP代码返回的二级下拉列表的数据（json格式的数组），并在第二个下拉列表中显示内容。

--------------------------------------

让我们先看看第一个下拉列表的点击事件onchange里面的代码内容

//ajax联动

//点击事件函数
function ldone(){
    //获取第一个下拉菜单选中的值
    var typerole = $("#roleval").val();

//本次选用jquery中的$.ajax({})来请求异步获取
    $.ajax({

　　//请求类型
        type:"post",

　　//请求的url地址和方法
        url:config.domain.localhost+"/care/get_ajax_group",

//返回的数据类型
        dataType:"json",
        //数据{变量名:变量值,用逗号隔开}
        data:{type:typerole},
        //如果成功访问并接收到数据
        success:function(data){
        //首先清空二级下拉列表
        $("#se1").empty();
        //声明一个字符变量，放入一个下拉列表选项元素作为初始
        var option = "<option value=''>"+"请选择"+"</option>";
        //将json格式的数据转换成数组
        var mod = eval(data);
        //进行遍历,类似于php的foreach,data是数据源，N是$key,value是$val
        $.each(data,function(n,value){
        var str = "";
        str +="<option value='"+value.id+"'>"+value.role_name+"</option>";
        option += str;
            });
        //给id为se1的下拉列表中赋值
        $("#se1").html(option);
            },

        error:function(msg){
            alert(msg);
            }
        });
};