今天工作需要写树形的联动，于是写了个可扩展的无限极联动下拉选项
代码写的比较凌乱 先mark有空再整理
随便截个图！
先贴数据库
idcategory_name 分类名pid 父分类idorders 排序
1 22223331 0 1
2 2222111 1 1
12 44444 11 0
5 2222 1 1
6 2222 1 1
11 333 2 0
13 555555 12 0
页面代码 用的smarty
复制代码 代码如下:
请选择分类
{$category.category_name}
$gallerycategory 去数据的php代码为
复制代码 代码如下:
$sql = select * from yl_gallery_category where pid = 0;
$gallerycategory = $db->query($sql);
$smarty->assign(gallerycategory,$gallerycategory);
用的原生态代码 还是比较容易理解的
然后就是关键的 js代码了function change(val) {
复制代码 代码如下:
var str = val; //select的id
    var num; //当前级数
    var id; // 分类id
    num = str.substr(9,10);
    //alert(num);
    var nownum = parseint(num)+1; // 将字符串转换为数字
    id = $(#+str+).val();
    var r = /^[1-9]+[0-9]*]*$/;　//正整数
    if (!r.test(id)) {
        //清空过时的选项
        $(select).each(function(index){
            if(index+1 > num) {
                $(this).remove();
            }
        })
return false;
    }
    var url = 'gallery.php?act=category&pid='+id;
    $.ajax({
        type: post,
        cache: false,
        url: url,
        datatype : 'json',
        timeout : 3000,
        success: function(result){
            if ( result != 0) {   
                var html = ;
                html += 请选择分类 ;
                var datas = eval(result);
                $.each(datas, function(i,val){     
                    html += +val.category_name+;
                });  
                html += ;
//清空过时的选项
                $(select).each(function(index){
                    if(index+1 > num) {
                        $(this).remove();
                    }
                })
$(#select).append(html);
            } else {
//清空过时的选项
                $(select).each(function(index){
                    if(index+1 > num) {
                        $(this).remove();
                    }
                })　}
},
        error: false
    });
}
ajax 取数据的php代码
复制代码 代码如下:
$sql = select * from yl_gallery_category where pid = .$pid;
    $res = $db->query($sql);
    if (empty($res)) {
        $res = 0;
    }
    echo json_encode($res);
ok 大功告成！