Einfache JS-Methode zum Implementieren der sekundären Linkage-Auswahl-Plug-in-Javascript-Fähigkeiten der Stadt-js-Tutorial-php.cn

Einfache JS-Methode zum Implementieren der sekundären Linkage-Auswahl-Plug-in-Javascript-Fähigkeiten der Stadt

WBOY

Freigeben： 2016-05-16 15:44:09

Original

1196 Leute haben es durchsucht

Das Beispiel in diesem Artikel beschreibt, wie Sie das sekundäre Linkage-Auswahl-Plug-in der Stadt einfach mit JS implementieren. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Das von js implementierte Stadtverknüpfungsmenü wird häufig im Internet vorgestellt. Der Prototyp dieses Stadtauswahlmenüs basiert hauptsächlich auf JavaScript wie Arrays und Schleifen. Dieser Effekt dient nur zur Demonstration der Implementierung. Die darin enthaltenen Daten sind unvollständig. Sie können sie bei Bedarf selbst hinzufügen.

Der Screenshot des Laufeffekts sieht wie folgt aus:

Die Online-Demo-Adresse lautet wie folgt:

http://demo.jb51.net/js/2015/js-ejld-city-cha-plug-codes/

Der spezifische Code lautet wie folgt:

<html>
<head>
<title>Js城市二级联动选择插件</title>
<script>
var citys=new Array(
new Array("南京","淮安","扬州","常州",'其它'),
new Array("北京"),
new Array("天津"),
new Array("上海"),
new Array("其它")
);
function scity(pname,cname){
var province=['江苏省','北京','天津','上海','其它'];
document.write('<select id="pro" onchange="selectc(this)" name="'+pname+'">');
document.write('<option value="">--选择省份--</option>')
for(var i=0;i<province.length;i++){
 document.write('<option value="'+province[i]+'">'+province[i]+'</option>');
}
document.write('</select>');
document.write('<select id="city" name="'+cname+'">');
document.write('<option value="">--选择城市--</option>');
document.write('</select>');
selectc(document.getElementById("pro"));
}
function selectc(pobj){
  var index=pobj.selectedIndex-1;
   var cobj=document.getElementById("city");
   cobj.innerHTML='';
   if(index>=0){
   for(var i=0;i<citys[index].length;i++){
   var option=document.createElement("option");
   var text=citys[index][i];
   option.value=text;
   option.innerHTML=text;
   cobj.appendChild(option);
   }
   }else{
   var option=document.createElement("option");
   option.value="";
   option.innerHTML="--选择城市--";
   cobj.appendChild(option);
   }
}
</script>
</head>
<body>
<script>
 scity('p','c');
</script>
</body>
</html>

Nach dem Login kopieren

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.