Maison > Article > interface Web > Menu de liaison entre les provinces et les villes implémenté par les compétences JavaScript array_javascript bidimensionnelles
Menu de liaison entre les provinces et les villes implémenté par les compétences JavaScript array_javascript bidimensionnelles
- WBOYoriginal
- 2016-05-16 16:49:271891parcourir
Copier le code Le code est le suivant :
//Initialiser un tableau bidimensionnel pour stocker les éléments de la liste de villes
var villes=[
["Anqing","Hefei","Tongcheng"],
[" Shijiazhuang","Baoding" ","Tangshan"],
["Zhengzhou","Luoyang","Kaifeng"]
]
//Lorsqu'une province est sélectionnée, appelez la méthode d'ajout a city
function provinceChanged( sel){
//alert("select length" sel.options.length);
//sel est en fait l'objet sélectionné
//Parcourez la collection d'options et trouver l'option sélectionnée
for( var x=0;x
var opt=sel.options[x]
if(opt.selected)
{
// Ajouter une option à la sélection de la ville sélectionnée
addCityToSelect(x)
}
}
}
//Ajouter l'élément de ville sous la province sélectionnée à la sélection de la ville
function addCityToSelect (x){
//Trouver la ville correspondante dans le tableau bidimensionnel
var city=cities[x-1]
var citySelect=document.getElementById(" select_city");
/*==================Supprimer les éléments qui existent déjà dans le nœud================ =
Au deuxième ou lorsque la méthode est appelée pour la nième fois, les nœuds précédemment ajoutés ont été ajoutés à l'objet de sélection de ville, il est donc effacé.
Idée 1 : sélectionnez RemoveChild() de l'objet, afin que les points d'octet puissent être supprimés via le parcours de boucle.
Idée 2 : définir directement select.options.length=1 peut obtenir le même effet.
*/
//Définissez la longueur des options sous l'objet de sélection de la ville sur 1
citySelect.options.length=1
//Définissez la longueur de la collection d'options et supprimez
/ /citySelect .options.length=1;
for(var x=0;x
//Créer un objet de nœud d'élément
var optionName=document.createElement( "option ");
//Définir le contenu d'affichage pour l'option
optionName.innerHTML=city[x];
//Ajouter l'option créée pour sélectionner
citySelect.appendChild(optionName); 🎜> /*
À cet endroit, ajoutez toutes les villes d'une certaine province à l'objet citySelect
Lorsque la deuxième province est sélectionnée pour la deuxième fois, toutes les villes de la deuxième province seront ajoutées. le nœud
citySelect. Cet effet est faux. Par conséquent, il est nécessaire de
effacer le contenu sous le nœud citySelect avant chaque ajout. Regard suivant :
==================Supprimer les éléments qui existent déjà dans le nœud ================
* /
}
}
option>Henan