<html>
<head>
<script language="javascript">
<!--
//--- 作者:冷夜飞雨 ---//
var vararr  =new Array();
vararr[0] = ['1-1'  ,1 ,0];
vararr[1] = ['2-1'  ,2 ,1];
vararr[2] = ['2-2'  ,3 ,1];
vararr[3] = ['3-1-1',4 ,2];
vararr[4] = ['3-1-2',5 ,2];
vararr[5] = ['3-2-1',6 ,3];
vararr[6] = ['3-2-2',7 ,3];
vararr[7] = ['3-2-2',8 ,0];
vararr[8] = ['3-2-2',9 ,8];
vararr[9] = ['3-2-2',10 ,9];
// [ 列表值 , ID , 父ID]function getselect(obj , arg)
{
    if( arg ==="" )return false;
    for(i=0,n=1;i < vararr.length;i++)
    {
        if( vararr[i][2] == arg )
        {
            obj.options[n] = null;
            obj.options[n] = new Option(vararr[i][0],vararr[i][1]);
            n++;
        }
    }
    obj.focus();
}
//-->
</script>
</head>
<body onload="getselect(document.getElementById('select1') , 0)">
<select name="select1" id="select1" onChange="getselect(document.getElementById('select2') , this.value);">
    <option value="">请选择</option>
</select>
<select name="select2" id="select2" onChange="getselect(document.getElementById('select3') , this.value);">
    <option value="">请选择</option>
</select>
<select name="select3" id="select3">
    <option value="">请选择</option>
</select>
</body>
</html> 

解决方案 »

  1.   

    恩,不错,用javascript DOM操作二级联动。不知道会不会?
      

  2.   

    把数据写成这样更好
    var vararr = [
     ['1-1' ,1 ,0],
     ['2-1' ,2 ,1],
     ['2-2' ,3 ,1],
     ['3-1-1',4 ,2],
     ['3-1-2',5 ,2],
     ['3-2-1',6 ,3],
     ['3-2-2',7 ,3],
     ['3-2-2',8 ,0],
     ['3-2-2',9 ,8],
     ['3-2-2',10 ,9]
    ];
      

  3.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>jQuery 无限级菜单</title>
        <style type="text/css">
        #menu a {
            color:#fff;
        }
        #menu div {
            /* text-align:center; */
        }
        #menu div a {
            padding-left:20px;
        }
        #menu div.root {
            display:block;
        }
        .list { background:url(list.gif) no-repeat 6px 6px; }
        </style>
        <script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript" language="javascript">
        $(function(){
            //颜色列表,如果想支持无限级,最好自动生成颜色列表,不过我的配色一项很差,用生成的就更惨不忍睹了……
            _cor = ['#003366', '#0066CC', '#3399FF', '#990000', '#CC0000', '#FF3300', '#FF9900', '#FFCC66', '#FFFFFF'];
            //初始化类
            (function Init(i,obj){
                i++;
                //查找子节点
                _obj = obj.children('div');
                //若有子节点,则增加一个专有式样
                if (_obj.length > 0)
                    obj.addClass('list');
                $.each(_obj, function(j,o){
                    //若是子目录则隐藏
                    if (i > 0)
                        $(o).hide();
                    //根据目录级数查找颜色字典上背景色,可改为图片什么的。
                    $(o).css('background-color',_cor[i]);
                    //查找子目录
                    Init(i,$(o));
                });
            })(-1,$('#menu'));
        });
        //跳转链接
        function GotoURL(obj) {
        alert(obj);
            //若链接最末一位不是符号“#”则跳转链接,因为取href得到链接绝对路径,所以只能取最后一位,其实可以传值判断或生成目录树时不产生onclick都是可以的
            if (obj.href.substring(obj.href.length - 1, obj.href.length) != "#") return true;
            //拉出和缩进的特效
            $.each($(obj).parent().children('div'), function(i,o){
                $(o).slideToggle('slow');
            });
            return false;
        }
        </script>
    </head>
    <body>    <div id="menu">
            <div> <a href="#" onclick="return GotoURL(this)">第一级</a> </div>
            <div> <a href="#" onclick="return GotoURL(this)">第一级</a>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a> </div>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a>
                    <div> <a href="#" onclick="return GotoURL(this)">第三级</a>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                    </div>
                    <div> <a href="#" onclick="return GotoURL(this)">第三级</a>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a> </div>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a> </div>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a>
                                <div> <a href="#" onclick="return GotoURL(this)">第六级</a> </div>
                                <div> <a href="#" onclick="return GotoURL(this)">第六级</a> </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a> </div>
            </div>
            <div> <a href="#" onclick="return GotoURL(this)">第一级</a>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a> </div>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a> </div>
                <div> <a href="#" onclick="return GotoURL(this)">第二级</a>
                    <div> <a href="#" onclick="return GotoURL(this)">第三级</a>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                    </div>
                    <div> <a href="#" onclick="return GotoURL(this)">第三级</a>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a> </div>
                        <div> <a href="#" onclick="return GotoURL(this)">第四级</a>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a> </div>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a> </div>
                            <div> <a href="#" onclick="return GotoURL(this)">第五级</a>
                                <div> <a href="#" onclick="return GotoURL(this)">第六级</a> </div>
                                <div> <a href="#" onclick="return GotoURL(this)">第六级</a> </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div></body>
    </html>
      

  4.   

      Q:怎样把 PHP 的一个数组传递给 javascript 的一个数组?
      A:用 javascript 定义一个数组比如 list=new array(),在 php 中有一个数组 $a[],如果要把数组 $a[]的值传递给 list 怎么办呢?
        〈?php
        echo “〈script language=javascript〉“;
        echo “list=new Array();“;
        for(i=0;i〈count($a);i++)
        { echo “list[i]=“ . $a[$i];}
        echo “〈/script〉“;
        ?〉