级联-city
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>城市注册</title>
</head>
<body>
省份
<select name="sf">
<option value="s1">请选择</option>
</select>
城市
<select name="cs" onclick="choose()">
<option value="c1">请选择</option>
</select>
</body>
<script type="text/javascript">
var sf=["请选择","辽宁省","吉林省","黑龙江省"];
var cs=[["请选择"],["沈阳市","大连市","鞍山市","抚顺市"],["长春市","吉林市","白山市"],["哈尔滨市","大庆市","牡丹江市"]];
var sfselect=document.querySelector("select");
var csselect=document.querySelector("select[name='cs']");
for(var i=0;i<sf.length;i++){
var option=document.createElement("option");
option.innerHTML=sf[i];
option.value=i;
sfselect.appendChild(option);
}
function choose(){
csselect.innerHTML="";
for(var i=0;i<cs[sfselect.value].length;i++){
var option=document.createElement("option");
option.innerHTML=cs[sfselect.value][i];
option.value=i;
csselect.appendChild(option);
}
}
</script>
</html>
级联-city的更多相关文章
- JS实战 · 级联菜单选择省份和城市（两种）
DOM编程步骤.思路 1.定义界面: 通过html标签将数据进行封装: 2.定义一些静态样式: 利用css: 3.需要动态地完成的和用户的交互: a:明确事件源: ...
- XML：使用DOM技术解析xML文件中的城市，实现select级联选择
中国的城市xml格式:cities.xml <?xml version="1.0" encoding="utf-8"?> <china> ...
- 省市级联.net
初学javascript,编译省市级联,使用json在一般处理程序中编译,利用ajax传递数据到web前台 <html xmlns="http://www.w3.org/1999/xh ...
- MVVM架构~knockoutjs系列之包括区域级联列表的增删改
返回目录 这个例子我做了几次,之前总是有BUG,目前测试后,确定没有BUG才发上来的,主要功能是实现“我的银行”模块的增删改的功能,这个里面包括了级联列表的区域选择,这部分是难点,在开发过程中,我们应 ...
- JavaScript实现省市级联效果实例
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- easyui combobox级联（转载）
一.创建combobox 有如下几种方式可以创建一个combobox 1.使用select标签,并加上class="easyui-combobox",这种方式比较适用于静态的选项. ...
- bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 省市区县镇级联数据JS版
前言:网站开发经常会涉及到报名,报名通常就会有地区级联的要求.如下所示.做这个功能就必须要有数据支撑.昨天努力了一天,从网上鼓捣了一份数据.分享下.纯技术性分享,非盈利的.如果有侵权的地方请知会,马上 ...
- iOS:城市级联列表的使用
1.介绍: 现在越来越多的项目都用到了地址,尤其是电商O2O的购物平台,我之前做的教育产品和电商产品都用到了,而实现地址的设置用到的技术就是城市级联列表,即普遍的做法就是自定义选择器控件UIPicke ...
随机推荐
- linux下文件传输一些方法整理.
ftp类 ftp 命令已经不推荐使用了. #基本用法 lftp sftp://[domain name] lftp sftp://theURL.org #使用不同用户名 lftp sftp://[us ...
- 有向网络（带权的有向图）的最短路径Dijkstra算法
什么是最短路径? 单源最短路径(所谓单源最短路径就是只指定一个顶点,最短路径是指其他顶点和这个顶点之间的路径的权值的最小值) 什么是最短路径问题? 给定一带权图,图中每条边的权值是非负的,代表着两顶点 ...
- JavaWeb_(Mybatis框架)MyBatis整合Spring框架
MyBatis + Spring整合开发 a)使用Spring容器用单例模式管理Mybatis的sqlSessionFactory:b)使用Spring管理连接池.数据源等:c)将Dao/Mapper ...
- 微信小程序开发-踩坑
异步请求处理 详情描述: 微信小程序的wx.request({})请求时异步处理,以下代码 wx.reuest({ url:"https://XXXA", method:" ...
- storm滑动窗口
Window滑动方式: 没有数据不滑动windowLength:窗口的时间长度/tuple个数slidingInterval:滑动的时间间隔/tuple个数 withWindow(Duration w ...
- hive进阶 技巧
1.日期格式转换(将yyyymmdd转换为yyyy-mm-dd) select from_unixtime(unix_timestamp('20180905','yyyymmdd'),'yyyy-mm ...
- springboot 整合缓存(Ehcache或者reids)
这里介绍Spring Boot结合JPA,MySQL和Ehcache实现缓存功能,提高程序访问效率. 一.Maven依赖 <!-- caching --> <dependency&g ...
- c++自定义数组越异常 ArrayIndexOutOfBoundsException (学习)
#include <iostream> using namespace std; const int DefaultSize = 10; class Array{public: Array ...
- postgresql之 drop & delete & truncate
官网:https://www.postgresql.org/docs/8.1/sql-droptable.html Name DROP TABLE -- remove a table Synopsis ...
- 阶段5 3.微服务项目【学成在线】_day04 页面静态化_22-页面静态化-静态化测试-静态化程序测试
测试service内些的静态化的方法 先新建一个测试类 模板的id 放到下拉的静态数据里面 这样这条数据 就是用用的轮播图005这个模板 把这条数据静态化 进入到断点里面.先获取数据模型 获取模板时 ...