多級數據級聯選擇，附省市縣級聯選擇功能   -----   JQUERY特效模板

   其實，這個功能網上也有很多功能模板，很多種方法都可以實現，都各有利弊，在此不對此做過多評價，這里只是提供另一種思路，也是我常用的一個辦法，便于擴展，可適用于數據量不是很大（總數據可以支持到上萬，前提是每個數據不會很長，基本上可以覆蓋大多數的級聯選擇應用）的多級級聯選擇。

   在這種方法中最重要的是級聯數據的組織方式，我是這么設置的：

       用一個js多維數組來保存級聯數據，一般來說，三級級聯選擇，需要一個二維數組，一個二級級聯選擇需要一個一維數組（就是普通數組），此處以三級級聯選擇為例。

var data = new Array();
data[一級節點1的id] = ['一級節點1的名稱',
                       ['二級節點11的名稱','三級節點111的名稱','三級節點112的名稱',…,'三級節點11n的名稱'],
                       ['二級節點12的名稱','三級節點121的名稱','三級節點122的名稱',…,'三級節點12n的名稱'],
                       …,
                       ['二級節點1n的名稱','三級節點1n1的名稱','三級節點1n2的名稱',…,'三級節點1nn的名稱']
                     ];
data[一級節點2的id] = ['一級節點2的名稱',
                       ['二級節點21的名稱','三級節點211的名稱','三級節點212的名稱',…,'三級節點21n的名稱'],
                       ['二級節點22的名稱','三級節點221的名稱','三級節點222的名稱',…,'三級節點22n的名稱'],
                       …,
                       ['二級節點2n的名稱','三級節點2n1的名稱','三級節點2n2的名稱',…,'三級節點2nn的名稱']
                     ];
………
data[一級節點n的id] = ['一級節點n的名稱',
                       ['二級節點n1的名稱','三級節點n11的名稱','三級節點n12的名稱',…,'三級節點n1n的名稱'],
                       ['二級節點n2的名稱','三級節點n21的名稱','三級節點n22的名稱',…,'三級節點n2n的名稱'],
                       …,
                       ['二級節點nn的名稱','三級節點nn1的名稱','三級節點nn2的名稱',…,'三級節點nnn的名稱']
                     ];

此時，獲取第一級select框的數據（既第一級節點數據）時可以只遍歷data數組:

var selector = $("#第一級select框id");
$.each(data,
    function(i,n)
    {
        selector.html('').append("<option value='"+i+"' selected>"+n[0]+"</option>");
    }
)

當第一級select框選中時，可以從對應的data[一級選中節點id] 中遍歷生成第二級select框的數據

var selector = $("#第二級select框id");
$.each(data[一級選中節點的id],
    function(i,n)
    {
        //排除當前所在第一級節點名稱
        if(i==0)continue;              
        selector.html('').append("<option value='"+i+"' selected>"+n[0]+"</option>");
    }
)

當第二級select框選中時，可以從對應的data[一級選中節點id][二級選中節點id] 中遍歷生成第三級select框的數據

var selector = $("#第三級select框id");
$.each(data[一級選中節點的id][二級選中節點的id],
    function(i,n)
    {
        //排除當前所在第二級節點名稱
        if(i==0)continue;             
        selector.html('').append("<option value='"+i+"' selected>"+n+"</option>");
    }
)

具體實例可參考附件中地址級聯選擇功能，需要注意的是，附件中實例使用前，需設置省，市，縣三個選擇框的id到area_choose.js中