通过对上一篇《省市区三级联动》的学习发现JScript部分省市区的填充代码几乎相同,所以可以写成一个函数。

注意:html部分和chuli.php部分不变

1.下拉列表填充可以写成带参数的函数

$("#sjld").html("<select id='sheng'></select><select id='shi'></select><select id='qu'></select>");

	//1.填充省市区
fill("0001",$("#sheng"));
fill($("#sheng"),$("#shi"));
fill($("#shi"),$("#qu"));

  

2.省或区发生改变,市和区的填充也写成带参数的函数

//2.改变省选择,相应的要重新填充市、区选择
$("#sheng").change(function(){ fill($("#sheng"),$("#shi"));
fill($("#shi"),$("#qu")); }) //3.改变市选择,相应的要重新填充区选择
$("#shi").change(function(){ fill($("#shi"),$("#qu")); })

  

3.填充省市区的函数方法可以写成fill(p,z)函数

function fill(p,z)
{
//获取父级代号
if(p=="0001")
{
var pcode=p;
}
else
{
var pcode=p.val();
}
//调用ajax方法
$.ajax({ async:false,
url:"chulisjld.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success: function(data){ var hang=data.split("|");
var str=""; for(var i=0;i<hang.length;i++)
{
var lie=hang[i].split("^"); str+="<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
z.html(str);
} })
}

  

省市区三级联动(二)JS部分简单版的更多相关文章

  1. 省市区三级联动,JS实现

    文件下载地址:http://files.cnblogs.com/files/chenwolong/jsAddress.rar 示例截图: 在这里自己记录一个方法: function cmbAddOpt ...

  2. QQ JS省市区三级联动

    如下图: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title ...

  3. JS实现年月日三级联动+省市区三级联动+国家省市三级联动

    开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...

  4. 插件 原生js 省市区 三级联动 源码

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. JS省市区三级联动

    不需要访问后台服务器端,不使用Ajax,无刷新,纯JS实现的省市区三级联动. 当省市区数据变动是只需调正js即可. 使用方法: <!DOCTYPE html><html>< ...

  6. 从QQ网站中提取的纯JS省市区三级联动

    在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动 QQ是使用引用外部JS来实现三级联动的.JS如下:http://ip.qq.com/js/geo.js <!DOC ...

  7. 使用腾讯IP分享计划网站中的纯JS省市区三级联动

    JS地址:http://ip.qq.com/js/geo.js 实例如下: <!DOCTYPE html> <html> <head> <title>省 ...

  8. JS 省市区三级联动

    JS 省市区三级联动: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...

  9. 【转】纯JS省市区三级联动(行政区划代码更新至2015-9-30)

    本文代码实现的功能是省市区三级联动下拉列表,纯Javascript,网上已有很多这方面的代码.但是作为一个新手,这是我的第一篇CSDN博客,发此文的目的主要是学习交流,希望看到的朋友发现有什么不对的地 ...

随机推荐

  1. css3常用动画效果集合01

    /*由右到左进场*/ .FromRightToLeft{ -webkit-animation:FromRightToLeft 500s .2s ease both; } @-webkit-keyfra ...

  2. 如何方便的控制css3动画开始时间点与持续时间

    一般我们在控制css3 animate动画时可以通过简写以减少代码量,只要在需要动画的元素上追加一下类名就可以了,如下例子 /*淡入并向上移动一点位置出现*/ .fadeInUp{ -webkit-a ...

  3. 说说怎么写clean code

    前两天参加了公司组织的一个培训,主题是“如何写出好的代码” ,刚看到这个主题,第一反应是又不知道是哪个培训机构来忽悠钱的!老大安排了,就去听听呗. 说实在的,课程内容没有什么新鲜的东西,就是讲讲如何发 ...

  4. imx6 android5.1 打开 调试串口

    imx6的工板烧录android 5.1的镜像,uboot中能使用debug口,kernel,文件系统中不能使用debug口. 打开kenel和文件系统debug口方法,在uboot的bootargs ...

  5. python笔记 - day7

    python笔记 - day7 参考: http://www.cnblogs.com/wupeiqi/articles/5501365.html 面向对象,初级篇: http://www.cnblog ...

  6. (转)linux运行tomcat时JRE_HOME显示不对怎么办?

    PS:以前也没出现这些问题,重装了一下系统,感觉什么都让我撞上了.Using CATALINA_BASE:   /usr/share/tomcat7Using CATALINA_HOME:   /us ...

  7. oracle ORA-00001:违反唯一约束条件

    --获取约束信息 select * from information_schema.constraint_column_usage---可以获取指定数据库中的所有约束的信息以及约束与列的对应关系 go ...

  8. MVC部署 - 错误集锦

    一.MVC部署后直接显示文件列表,路由未生效,效果如下: 处理方法为:Web.Config修改一下配置: <system.webServer> <validation validat ...

  9. android AlarmManager 详解

    在开发互联网应用时候,我们常常要使用心跳来保证客户端与服务器的连接.怎么完成心跳很关键,在说道客户端心跳功能时,如果使用Timer或者专门开起一个线程来做心跳的工作,会浪费CPU工作时间,而且也会更多 ...

  10. Unity3D 插件大全

    2D_Toolkit 2d动画开发插件包 FingerGestures 触摸插件 ORK_Okashi_RPG_Kit Unity3D角色扮演游戏开发工具包 uScript-Visual-Script ...