Rumah > hujung hadapan web > tutorial js > Buat pautan tiga peringkat mudah dengan kemahiran JS_javascript

Buat pautan tiga peringkat mudah dengan kemahiran JS_javascript

WBOY
Lepaskan: 2016-05-16 16:08:42
asal
1363 orang telah melayarinya

Pautan tiga peringkat mudah dibuat dengan javascript, sangat mudah dan praktikal

Salin kod Kod adalah seperti berikut:




          
                                                                                                                                                      

Wilayah:
         
Daerah:
          


//Nyatakan wilayah
        var pres = ["Beijing", "Shanghai", "Shandong"]; //Declare Array
terus                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                //nyatakan bandar       var bandar = [
              ["Dongcheng", "Changping", "Haidian"],
                                                                            ["Pudong", "高区"],
             ["Jinan", "Qingdao"]
];
      var kawasan = [
                                                                                                                                                                                                                                                                                                                                                                                   .                                                                 ["Menukar 1", "Menukar 2", "Menukar 3"],
                                ["Haidian1", "Haidian2", "Haidian3"]
],
                                                                                                                                                                                                                                                                                                                                                ["Pudong1", "Pudong2", "Pudong3"],
                                                                                                                                                                                                                                                                                                         Sejak ],
                                                               ["Jinan1", "Jinan2"],
                                 ["Qingdao 1", "Qingdao 2"]
]
]
//Tetapkan subskrip awam bagi wilayah
        var pIndex = -1;
         var preEle = document.getElementById("pre");
         var cityEle = document.getElementById("city");
      var areaEle = document.getElementById("kawasan");
//Tetapkan nilai wilayah dahulu
untuk (var i = 0; i < pres.length; i ) {
//Istiharkan pilihan.Pres[i]
               var op = new Option(pres[i], i);
                                                                                                                                                                                                                                                                          preEle.options.add(op);
}
         fungsi chg(obj) {
Jika (obj.value == -1) {
CityEle.options.length = 0;
areaEle.options.length = 0;
            }
//Dapatkan nilai
            var val = obj.value;
              pIndex = obj.value;
//Dapatkan tindakan
          var cs = bandar[val];
//Dapatkan kawasan lalai
          var as = kawasan[val][0];
                //Kosongkan pasaran dahulu
               cityEle.options.length = 0;
areaEle.options.length = 0;
untuk (var i = 0; i < cs.length; i ) {
              var op = new Option(cs[i], i);
                    cityEle.options.add(op);
            }
untuk (var i = 0; i < as.length; i ) {
              var op = new Option(as[i], i);
areaEle.options.add(op);
            }
}
         fungsi chg2(obj) {
            var val = obj.selectedIndex;
          var as = kawasan[pIndex][val];
areaEle.options.length = 0;
untuk (var i = 0; i < as.length; i ) {
              var op = new Option(as[i], i);
areaEle.options.add(op);
            }
}


Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan