javascript實現簡單的二級連動_javascript技巧

二級連動在一般的網頁中隨處可見，一般是地址，例如點擊浙江省，隨後出現的是杭州市，嘉興市；點擊北京省出現的是朝陽，海淀，而不是出現杭州，嘉興。

要實現這個步驟，就要用到javascript來實現。其中原理用到onchange時間。

首先，onchange 事件會在網域的內容改變時發生。支援該事件的 JavaScript 物件：fileUpload, select, text, textarea，我們在實作二級連動中正是用到select來完成。

以下是HTML程式碼，先設定一個select為省，第二個select為市，但市我們在js中用陣列將其與省份連接。

複製程式碼 程式碼如下:

   
   



    省
    北京
    浙江

 以下是js程式碼

複製程式碼 程式碼如下:

var province = document.getElementById("province");
var city = document.getElementById("city");
var area = [
['朝陽','海淀','北京'], //第0個area的數組。 0{0,1,2}
['杭州','海寧']         //第1個area的陣列, 1{0.1}
];
 function choose(){
     var opt = "";
var len = area[province.value];  //如果選擇北京0，那麼，len=['朝陽'，'海淀']    這個是連接哪個省份對應著哪個市的市的陣列
if(province.value == '-1'){     //因為select的value為-1的時候是'省'這個字，而不是北京，所以，我們選擇這個省的時候對應著讓他的市為空
         city.innerHTML = opt;
     }
     for(var i = 0;i opt = opt '  ' len[i] ''  //opt = "" 朝陽(lin[0]) ,
     //opt = 朝陽(lin[0]),
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
     海淀(lin[1])
     //opt = 朝陽(lin[0]),
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
     海淀(lin[1])
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
     北京(lin[2])
     }
     city.innerHTML = opt;
}
province.onchange = function(){
    choose();
}

二級連動在一般的網頁中隨處可見，一般是地址，例如點擊浙江省，隨後出現的是杭州市，嘉興市；點擊北京省出現的是朝陽，海淀，而不是出現杭州，嘉興。

要實現這個步驟，就要用到javascript來實現。其中原理用到onchange時間。

以上所述就是本文的全部內容了，希望大家能夠喜歡。