Comment utiliser JavaScript pour établir des liens entre les provinces et les villes-js tutoriel-php.cn

Comment utiliser JavaScript pour établir des liens entre les provinces et les villes

亚连

Libérer： 2018-06-22 17:19:13

original

2262 Les gens l'ont consulté

Cet article présente principalement en détail comment résoudre les bugs dans le processus de réalisation des liens provinciaux et municipaux via JavaScript. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Tout d'abord, implémentez le provincial. et liaison municipale. Décrire les problèmes rencontrés

1.1.Idée originale

1.1.1 Initialiser le chargement des provinces

$.ajax({
  &#39;type&#39; : &#39;POST&#39;,
  &#39;dataType&#39; : &#39;json&#39;,
  &#39;url&#39; : &#39;${rc.contextPath}/crm/merchantMgr/editMerchantBankAccount.htm?method=getBankProvinces&#39;,
  &#39;success&#39; : function(msg) {
   bankProvinces = msg;
   for(var i=0;i<bankProvinces.length;i++){
   $("#key_DSGAprovince").append("<option value=&#39;"+bankProvinces[i][0]+"&#39;>"+bankProvinces[i][0]+"</option>");
   }
   
  },
  &#39;cache&#39; : false,
  &#39;async&#39; : false
 });

Copier après la connexion

1.1.2. provinces

function getBankCitys(){
$("#key_DSGAcity").empty();
 var DSGAprovince=$("#key_DSGAprovince option:selected").text();
 $.ajax({
 &#39;type&#39;:&#39;POST&#39;,
 &#39;data&#39;: {"province":DSGAprovince}, 
 &#39;dataType&#39;: &#39;json&#39;,
 &#39;url&#39;:&#39;${rc.contextPath}/crm/merchantMgr/editMerchantBankAccount.htm?method=getBankCities&#39;,
 &#39;success&#39; : function(msg) {
   cities = msg;
   for(var i=0;i<cities.length;i++){
   $("#key_DSGAcity").append("<option value=&#39;"+cities[i][0]+"&#39;>"+cities[i][0]+"</option>");
   }
  },
 });
}

Copier après la connexion

1.1.3. Problèmes

Lors du chargement, il n'y a pas de problème et la liaison peut être réalisée, mais lors de l'écho, les villes ne peuvent pas être chargées, mais les provinces peuvent être chargées.

 var tVal = &#39;海南省&#39;;
 if(tVal!=""){$("#key_DSGAprovince").val(tVal);}
 
 var tVal = &#39;文昌&#39;;
 if(tVal!=""){$("#key_DSGAcity").val(tVal);}

Copier après la connexion

1.1.4. Analyse

En effet, lors de l'initialisation, seules les provinces sont chargées, et if(tVal!=""){$("#key_DSGAcity" ). val(tVal);} Cette phrase signifie que l'option de la ville doit être placée sur la page avant que la valeur puisse être récupérée.

1.1.5. Solution

var DSGAprovince = &#39;${myObj.DSGAprovince?default("请选择")}&#39;;
 $.ajax({
 &#39;type&#39;:&#39;POST&#39;,
 &#39;data&#39;: {"province":DSGAprovince}, 
 &#39;dataType&#39;: &#39;json&#39;,
 &#39;url&#39;:&#39;${rc.contextPath}/crm/merchantMgr/editMerchantBankAccount.htm?method=getBankCities&#39;,
 &#39;success&#39; : function(msg) {
   cities = msg;
   for(var i=0;i<cities.length;i++){
   $("#key_DSGAcity").append("<option value=&#39;"+cities[i][0]+"&#39;>"+cities[i][0]+"</option>");
   }
  },
 &#39;cache&#39;:false,
 &#39;async&#39;:false,
 });

Copier après la connexion

Il suffit de la charger une fois selon la province lors de l'initialisation.

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles associés :

À propos des principes de réactivité dans Vue (tutoriel détaillé)

Comment implémenter le format d'horodatage et de date à l'aide de js Conversion entre

Problèmes avec la route par défaut qui ne se charge pas dans vue.js

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!