<!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的更多相关文章

  1. JS实战 · 级联菜单选择省份和城市（两种）

    DOM编程步骤.思路 1.定义界面:      通过html标签将数据进行封装: 2.定义一些静态样式:      利用css: 3.需要动态地完成的和用户的交互:      a:明确事件源:     ...

  2. XML：使用DOM技术解析xML文件中的城市，实现select级联选择

    中国的城市xml格式:cities.xml <?xml version="1.0" encoding="utf-8"?> <china> ...

  3. 省市级联.net

    初学javascript,编译省市级联,使用json在一般处理程序中编译,利用ajax传递数据到web前台 <html xmlns="http://www.w3.org/1999/xh ...

  4. MVVM架构~knockoutjs系列之包括区域级联列表的增删改

    返回目录 这个例子我做了几次,之前总是有BUG,目前测试后,确定没有BUG才发上来的,主要功能是实现“我的银行”模块的增删改的功能,这个里面包括了级联列表的区域选择,这部分是难点,在开发过程中,我们应 ...

  5. JavaScript实现省市级联效果实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. easyui combobox级联（转载）

    一.创建combobox 有如下几种方式可以创建一个combobox 1.使用select标签,并加上class="easyui-combobox",这种方式比较适用于静态的选项. ...

  7. bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)

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

  8. 省市区县镇级联数据JS版

    前言:网站开发经常会涉及到报名,报名通常就会有地区级联的要求.如下所示.做这个功能就必须要有数据支撑.昨天努力了一天,从网上鼓捣了一份数据.分享下.纯技术性分享,非盈利的.如果有侵权的地方请知会,马上 ...

  9. iOS:城市级联列表的使用

    1.介绍: 现在越来越多的项目都用到了地址,尤其是电商O2O的购物平台,我之前做的教育产品和电商产品都用到了,而实现地址的设置用到的技术就是城市级联列表,即普遍的做法就是自定义选择器控件UIPicke ...

随机推荐

  1. C语言学习笔记11- 文件I/O

    C语言学习笔记11- 文件I/O  ..待编辑 文件操作(CRT.C++.WIN API.MFC)

  2. 用python实现简易学生管理系统

    以前用C++和Java写过学生管理系统,也想用Python试试,果然“人生苦短,我用Python”.用Python写的更加简洁,实现雏形也就不到100行代码. 下面上代码 #!/usr/bin/pyt ...

  3. Python学习日记（七）——装饰器

    1.必备知识 #### 一 #### def foo(): print 'foo' foo #表示是函数 foo() #表示执行foo函数 #### 二 #### def foo(): print ' ...

  4. CSP2019懵逼记

    CSP2019 考场二日游 CJ 旅游团 本来我是准备咕掉的, 但是被强 ♂ 烈要求更博了 Day -INF ~ Day -1 专题巩固和联考 前面半个月疯狂爆炸 后面半个月状态恢复了, 考得还行 联 ...

  5. JAVA基础知识|抽象类与接口类

    一.抽象类 抽象类:拥有抽象方法的类就是抽象类,抽象类要使用abstract声明 抽象方法:没有方法体的方法,必须要使用abstract修饰 为什么要使用抽象类,抽象方法? 举例来说,如果你定义了一个 ...

  6. 第04组 Beta冲刺（1）

    队名:斗地组 组长博客:地址 作业博客:Beta冲刺(1/4) 各组员情况 林涛(组长) 过去两天完成了哪些任务: 1.分配展示任务 2.收集各个组员的进度 3.写博客 展示GitHub当日代码/文档 ...

  7. jupyter notebook 安装代码提示功能

    我的是在anaconda中的root环境下运行以下命令,在其他环境下发现没有效果 1 pip install jupyter_contrib_nbextensions jupyter contrib ...

  8. 《你不知道的JavaScript（上）》笔记——函数作用域和块作用域

    关于函数声明:如果 function 是声明中的第一个词, 那么就是一个函数声明, 否则就是一个函数表达式.例如匿名函数这种形式,函数会被当作函数表达式而不是一个标准的函数声明来处理. (functi ...

  9. Canvas-基本用法

    Canvas教程-MDN HTML 5 Canvas 参考手册 <canvas>是一个可以使用脚本(通常为JavaScript)来绘制图形的 HTML 元素.例如,它可以用于绘制图表.制作 ...

  10. Qt编写安防视频监控系统3-通道交换

    一.前言 最开始写通道交换的功能的时候,走了很多弯路,比如最开始用最初级的办法,触发交换的时候,先关闭视频,然后设置新的url重新打开视频,这样处理非常低级而且耗内存还卡还很慢,毕竟重新打开视频都需要 ...