Requirements: To achieve the linkage of address selection
<! DOCTYPE html>Select {width:100px; padding:5px; Font-size:16px; } </style>//define information for provinces and cities varProvlist = [' Jiangsu ', ' Zhejiang ', ' Fujian ', ' Hunan ']; varCityList = []; citylist[0] = [' Nanjing ', ' Suzhou ', ' Suqian ', ' Yangzhou ']; citylist[1] = [' Hangzhou ', ' Wenzhou ', ' Ningbo ', ' Taizhou ']; citylist[2] = [' Fuzhou ', ' Xiamen ', ' Quanzhou ', ' Zhangzhou ']; citylist[3] = [' Changsha ', ' Xiangtan ', ' Zhuzhou ', ' Xiangxi ']; //Get Select Element varProvselect = Document.queryselector (' #prov '); varCityselect = Document.queryselector (' #city '); //Add the province's information to the first SELECT elementProvlist.foreach (function(val, index) {//DOM Operations LearnProvselect.add (NewOption (val, index)}); //bind a Change event to the first selectProvselect.onchange =function(){ //gets the current options varindex = This. Value; //Empty the second select original contentCityselect.length = 0; //Select a list of cities to add to the second selectCitylist[index].foreach (function(val, index) {cityselect.add (NewOption (val, index)); }) } //manually triggering a change eventProvselect.onchange (); </script></body>"Html+css+javascript" Implementation of address selection linkage