解决JavaScript实现省市联动过程中的bug

2024-12-05 01:54:02

先把实现省市联动遇到的问题描述一下

1.1.原来的思路

1.1.1、初始化加载省份

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

  },
  'cache' : false,
  'async' : false
 });

1.1.2、当点击省份的时候加载城市

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

   }
  },

 });
}

1.1.3、问题点

当加载的时候是没有问题的能实现联动，但是当回显的时候是不能加载城市的，但是省份能加载进来。

 var tVal = '海南省';
 if(tVal!=""){$("#key_DSGAprovince").val(tVal);}

 var tVal = '文昌';
 if(tVal!=""){$("#key_DSGAcity").val(tVal);}

1.1.4、分析

这是因为在初始化的时候，只是加载进来省份了，而if(tVal!=""){$("#key_DSGAcity").val(tVal);}这句话的意思就是说必须前提条件把城市的option里面放到页面才能取出来值。

1.1.5、解决方案

var DSGAprovince = '${myObj.DSGAprovince?default("请选择")}';

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

在初始化的时候就根据省份加载一遍就可以了。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

js省市联动效果完整实例代码

本文实例讲述了js省市联动效果.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <html> <head> <title></title> <script language="javascript" type="text/javascript"> //定义城市数据数组 cityArray = new Array(); cityArray[0] = new Array("北
js实现省市联动效果的简单实例

实例如下: 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>省市二
基于JS实现省市联动效果代码分享

在日常项目开发阶段经常见到下拉框二级联动效果,尤其是涉及地区.品种等有多级选项时.比如说:常见的省市联动下拉框,在选择省份时,城市列表也会更随改变. 思路: 1,所谓联动效果,是指出发父级的数据变化时,会影响到关联性子级数据元素的变化. 下面是造的省市的数据: var linkDatas = { provinces:[ { "code":"0", "name":"请选择" }, { "code":"
JavaScript二维数组实现的省市联动菜单

复制代码代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> //初始化一个二维数组存储城市列表项 var cities=[ ["安庆","合肥",&
javascript 09年最新版的省市联动

请选择请选择请选择 var areaData = "110000|北京市,110100|市辖区,110101|东城区,110102|西城区,110103|崇文区,110104|宣武区,110105|朝阳区,110106|丰台区,110107|石景山区,110108|海淀区,110109|门头沟区,110111|房山区,110112|通州区,110113|顺义区,110114|昌平区,110115|大兴区,110116|怀柔区,110117|平谷区,110200|县,110228|密云县,11
JSON+HTML实现国家省市联动选择效果

复制代码代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>json</title> <script type="text/javascript"> <!-- v
JavaScript省市联动实现代码

复制代码代码如下: <html><head> <title>JS省市二级联动菜单,整理收集.</title></head><body bgcolor="#FFFFFF" alink="#333333" vlink="#333333" link="#333333" topmargin="0" leftmargin="0&
解决JavaScript实现省市联动过程中的bug

先把实现省市联动遇到的问题描述一下 1.1.原来的思路 1.1.1.初始化加载省份 $.ajax({ 'type' : 'POST', 'dataType' : 'json', 'url' : '${rc.contextPath}/crm/merchantMgr/editMerchantBankAccount.htm?method=getBankProvinces', 'success' : function(msg) { bankProvinces = msg; for(var i=0;i<b
JavaScript实现省市联动过程中bug的解决方法

本文为大家分享了JavaScript实现省市联动过程中bug的解决方法,供大家参考,具体内容如下先把实现省市联动遇到的问题描述一下 1.1.原来的思路 1.1.1.初始化加载省份 $.ajax({ 'type' : 'POST', 'dataType' : 'json', 'url' : '${rc.contextPath}/crm/merchantMgr/editMerchantBankAccount.htm?method=getBankProvinces', 'success' : fun
JavaScript实现省市联动效果

本文实例为大家分享了JavaScript实现省市联动的具体代码,供大家参考,具体内容如下实现效果: 1.当点击文字时选中对应的下拉菜单 2.选择省,后面跟本省对应的市实现过程: 1.获得省的Dom对象 2.用循环为省的下拉菜单设置option子节点,并将数组每个pName的值赋给创建的子节点 3.每次循环同时为option子节点设置value属性 4.同理在点击省的同时,为市创建option子节点,并将cName的值赋给子节点,设置属性实现细节: 1. 点击省时采用onchange事件(元
基于JavaScript实现省市联动效果

本文实例为大家分享了JavaScript实现省市联动效果的具体代码,供大家参考,具体内容如下代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>省市级联动效果</title> </head> <body onload="initProvince()"> 省
解决vue.js在编写过程中出现空格不规范报错的问题

找到build文件夹下面的webpack.base.conf.js文件. 然后打开该文件,找到图下这段代码,把他注释掉. 注释掉之后,再进行子页面等编写的时候,空格不规范的情况下也不会再报错啦.因为这个报错对于初学者来说实在头大.哈哈O(∩_∩)O哈哈~ 我标注的这些地方,原本是有严格的空格规范要求的,这些报错真是另人烦躁呀o(╥﹏╥)o 反正我把这个问题解决了,特别开心哒哒哒~~~ 以上这篇解决vue.js在编写过程中出现空格不规范报错的问题就是小编分享给大家的全部内容了,希望能给大家一个参考
解决新建一个vue项目过程中遇到的问题

我就废话不多说了,大家还是直接看代码吧~ /usr/local/bin/node /usr/local/lib/node_modules/npm/bin/npm-cli.js run dev --scripts-prepend-node-path=auto > mytodolists@1.0.0 dev /Users/chenqiurui/WebstormProjects/myVue > webpack-dev-server --inline --progress --config build
总结Python使用过程中的bug

Python使用过程中的bug 问题: 在vscode中, 使用 Windows PowerShell 运行 conda activate xxx (某个环境)切换环境时报错: If using 'conda activate' from a batch script, change your invocation to 'CALL conda.bat activate'. 原因: PowerShell 有时不好使解决方法: 改为用 cmd 运行问题: conda install xxxx
解决Oracle图形化安装过程中出现的竖线问题

这种情况上传个jre 并指定下就好了总结以上所述是小编给大家介绍的关于ORACLE图形化安装过程中出现的竖线的处理办法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的.在此也非常感谢大家对我们网站的支持! 如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
关于java编译过程中的bug说明

今天组内兄弟提交代码我更新以后发现编译通过不了异常信息如下:The method getPOIByName(String) of type POISearchByGeoway must override a superclass method这玩意儿我之前遇到过,于是想写博客记之,以飨来者!ok 解决方案如下:1.右键项目>Build Path>Configure Build Path >> JAVA Compiler 修改Compiler Compliance level
JavaScript实现网页下拉列表的省市联动

大家好,今天我和大家分享网页中下拉列表的省市联动.在我们平常填写一些信息时就会有省市联动,就是在第一个下拉列表中选择我们所在的省,后面一个下拉列表显示该省的所有城市. 既然是省市联动,我们就不能把数据直接写到网页上,我们应该通过第一个下拉列表的省动态生成该省的所有城市.我们可以先定义一个JSON对象表示省,在对象中定义一个数组存储一个省中的所有城市(这里的城市也是JSON对象),最后用数组存储所有的省.我们可以利用JavaScript在网页上面添加选项option.联动这块我们可以为第一个下拉列

解决JavaScript实现省市联动过程中的bug

相关推荐

随机推荐