三级联动DropDownList

 <script type="text/javascript">

        $(function () {

            function reset(obj) {
                return $(obj).html("<option>请选择</option>");
            }

            var Data = { NOKIA: { 高众: "张华,刘强", 黑龙江: "刘钱,张飞" },
                Apple: { MicroSoft: "Opera,Tenct", Tecent: "mahuateng,Dog" }
            };
            $.each(Data, function (PF) {
                $("#selectFactory").append("<option>" + PF + "</option>");
            })

            $("#selectFactory").change(function () {
                reset("#selectAgent");
                reset("#selectSell");

                $.each(Data, function (PF, PA) {
                    if ($("#selectFactory option:selected").text() == PF) {
                        $.each(PA, function (PT, PS) {
                            $("#selectAgent").append("<option>" + PT + "</option>");
                        })

                        $("#selectAgent").change(function () {
                            reset("#selectSell");

                            $.each(PA, function (PT, PS) {
                                if ($("#selectAgent option:selected").text() == PT) {
                                    $.each(PS.split(','), function () {
                                        $("#selectSell").append("<option>" + this + "</option>");
                                    })
                                }
                            })
                        })
                    }
                })

 

            })
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <a href="表单应用.aspx">返回</a><br />
    <span>请选择需要的产品</span>
    <div>
        厂家:
        <select id="selectFactory">
            <option value="请选择">请选择</option>
        </select>
        代理商:
        <select id="selectAgent">
            <option value="请选择">请选择</option>
        </select>
        销售商:
        <select id="selectSell">
            <option value="请选择">请选择</option>
        </select>
        <input type="button" value="购买" />
    </div>
    </form>
</body>
</html>

posted on 2012-02-05 21:31  君凌  阅读(155)  评论(0编辑  收藏  举报

导航