省市区三级联动(二)JS部分简单版
通过对上一篇《省市区三级联动》的学习发现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部分简单版的更多相关文章
- 省市区三级联动,JS实现
文件下载地址:http://files.cnblogs.com/files/chenwolong/jsAddress.rar 示例截图: 在这里自己记录一个方法: function cmbAddOpt ...
- QQ JS省市区三级联动
如下图: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title ...
- JS实现年月日三级联动+省市区三级联动+国家省市三级联动
开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...
- 插件 原生js 省市区 三级联动 源码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JS省市区三级联动
不需要访问后台服务器端,不使用Ajax,无刷新,纯JS实现的省市区三级联动. 当省市区数据变动是只需调正js即可. 使用方法: <!DOCTYPE html><html>< ...
- 从QQ网站中提取的纯JS省市区三级联动
在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动 QQ是使用引用外部JS来实现三级联动的.JS如下:http://ip.qq.com/js/geo.js <!DOC ...
- 使用腾讯IP分享计划网站中的纯JS省市区三级联动
JS地址:http://ip.qq.com/js/geo.js 实例如下: <!DOCTYPE html> <html> <head> <title>省 ...
- JS 省市区三级联动
JS 省市区三级联动: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...
- 【转】纯JS省市区三级联动(行政区划代码更新至2015-9-30)
本文代码实现的功能是省市区三级联动下拉列表,纯Javascript,网上已有很多这方面的代码.但是作为一个新手,这是我的第一篇CSDN博客,发此文的目的主要是学习交流,希望看到的朋友发现有什么不对的地 ...
随机推荐
- Asp.net Session保存到Redis: 使用 RedisSessionStateProvider
Install-Package Microsoft.Web.RedisSessionStateProvider 依赖于: Dependencies StackExchange.Redis.Strong ...
- android判断pad还是手机
第一种. Rect frame = new Rect(); getWindow().getDecorView().getWindowVisibleDisplayFrame(frame); if (fr ...
- 从高版本JDK换成低版本JDK报错Unsupported major.minor version 52.0
ava.lang.UnsupportedClassVersionError: PR/Sort : Unsupported major.minor version 52.0这个错误是由于高版本的java ...
- hdu1231最大连续子序列
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1231 #include<iostream> #include<cstdio> ...
- 使用 Redis 实现分布式系统轻量级协调技术
http://www.ibm.com/developerworks/cn/opensource/os-cn-redis-coordinate/index.html 在分布式系统中,各个进程(本文使用进 ...
- BIND_MISMATCH导致过多VERSION COUNT的问题
并不是用了绑定变量就一定都会游标共享,下面我们介绍的就是一种例子.BIND_MISMATCH导致VERSION COUNT过多的原因解释: This is due to the bind buffer ...
- 如何在 Linux 中清除缓存(Cache)
如何在 Linux 中清除缓存(Cache) 方法一: http://mp.weixin.qq.com/s?__biz=MjM5ODAzODgyMQ==&am ...
- 在Windows上安装PyCUDA跟Theano
http://www.myexception.cn/cuda/1904274.html
- C语言中malloc()和calloc()c函数用法
C语言中malloc()和calloc()c函数用法 函数malloc()和calloc()都可以用来动态分配内存空间,但两者稍有区别. malloc()函数有一个参数,即要分配的内存空间的大小: ...
- [转载]Oracle修改表空间大小
Oracle修改表空间大小 使用Oracle10g建立数据库后,向数据库中导入了部分数据,第二天继续向数据库中导入数据表时发生错误: 查了很多资料发现原来是Oracle表空间限制,导致无法继续导入数据 ...