<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script>
        var datas = {
            '广东': ['深圳', '广州'],
            '河南': ['郑州', '洛阳'],
            '湖北': ['武汉', '宜昌']
        }
        $(function () {

            var province = $('<select></select>').appendTo('body');
            province.change(function () {
                loadCity();
            });
            $.each(datas, function (key, value) {
                $('<option value="' + key + '">' + key + '</option>').appendTo(province);
            });
            var city = $('<select></select>').appendTo('body');
            loadCity();
            

            function loadCity() {
                city.empty();
                var citys = datas[province.val()];               
                $.each(citys, function (index, value) {
                    $('<option>' + value + '</option>').appendTo(city);
                });
            }

        });
    </script>
</head>
<body>

</body>
</html>

jQuery省市联动的更多相关文章

  1. jquery省市联动，根据公司需求而写

    //author:guan //2015-05-25 //省市联动 //实用说明,页面引用如下js //<script src="../js/jquery-1.6.3.min.js&q ...

  2. jQuery省市联动（XML/JSON）

    准备: 导包 在src下导入c3p0-config.xml 导入JDBCUtil 创建数据库 新建js文件夹导入jQuery配置文件 NO01:创建city.jsp页面 <%@ page lan ...

  3. Json 基于jQuery+JSON的省市联动效果

    helloweba.com 作者:月光光 时间:2012-09-12 21:57 标签: jQuery  JSON  Ajax  省市联动     省市区联动下拉效果在WEB中应用非常广泛,尤其在一些 ...

  4. jquery插件-省市联动

        由于项目需要需要实现一个省市联动,由于业务有一些特殊的需求,使用现有的插件略有不便,就自己实现了一个.     首先需要保存地区数据的JS数据文件,我这里命名为areaData.js,内容如下 ...

  5. jQuery实现省市联动

    未实现任何功能之前: 实现功能之后: 实现该功能的jQuery核心代码: <script> var provinceArr=new Array(5); provinceArr[0]=new ...

  6. Django（二十）下拉列表-省市联动实例：jquery的ajax处理前端

    一.知识点 1.jquery的ajax请求写法 <script src="/static/js/jquery-1.12.4.min.js"></script> ...

  7. 用jquery实现省市联动

    <!-- 需求: [1] 动态生成省份选择框. [2] 当选择了省份的某一项时, 动态改变 城市选择中的列表项. --> <!DOCTYPE html> <html la ...

  8. Ajax省市联动

    以JQuery为JS,写的Ajax省市联动. 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  9. html + ashx 实现Ajax省市联动

    基本思路:1.了解数据库中省和市的表结构及关联主键 2.创建html页面及select标签 3.通过ajax向ashx(一般处理程序)发送后台请求完成联动效果 表结构: 这里,开始创建一个命为demo ...

随机推荐

  1. 《从零開始学Swift》学习笔记（Day 71）——Swift与C/C++混合编程之数据类型映射

    原创文章.欢迎转载.转载请注明:关东升的博客 posted @ 2017-07-21 13:23 zhchoutai 阅读(...) 评论(...) 编辑 收藏

  2. 20+ 个很有用的 jQuery 的 Google 地图插件 （英语）

    20+ 个很有用的 jQuery 的 Google 地图插件 (英语) 一.总结 一句话总结:英语提上来我才能快速去google上面找资源啊.google上面的资源要比百度丰富很多,然后有了英语就可以 ...

  3. Linux安装.Net core 环境并运行项目

    原文:Linux安装.Net core 环境并运行项目 一 安装环境 1.  从微软官网下载 Linux版本的.NetCoreSdk 2.0 安装包 打开终端: 第一步: sudo yum insta ...

  4. 数字图像处理原理与实践（MATLAB版）勘误表

    本文系<数字图像处理原理与实践(MATLAB版)>一书的勘误表. [内容简单介绍]本书全面系统地介绍了数字图像处理技术的理论与方法,内容涉及几何变换.灰度变换.图像增强.图像切割.图像去噪 ...

  5. 与Qt的联系方式：邮件，论坛，销售，Bug报告

    If you want to learn more about upcoming things for Qt, please stay tuned for new blog posts and web ...

  6. Oracle中的游标（转）

    Oracle中的游标有两种:显式游标.隐式游标.显示游标是用cursor...is命令定义的游标,它可以对查询语句(select)返回的多条记录进行处理,而隐式游标是在执行插入 (insert).删除 ...

  7. hbase 2.0.2 put和delete的一些坑

    测试的inbox表为多版本表,封装的scanTable已设置查询全部版本,以下的测试基于hbase2.0.2 一.put(针对相同的rowkey) 测试1.使用方法链的形式对同一个put添加数据到不同 ...

  8. 文件控制 fcntl函数具体解释

    摘要:本文主要讨论文件控制fcntl函数的基本应用.dup函数能够拷贝文件描写叙述符,而fcntl函数与dup函数有着异曲同工之妙.而且还有更加强大的功能,能够获取或设置已打开文件的性质,操作文件锁. ...

  9. svn创建版本库和删除版本库

    作者:朱金灿 来源:http://blog.csdn.net/clever101 svn创建版本库的做法:使用cd命令进入版本仓库的根目录,我的是E:\Repository,然后运行命令: svnad ...

  10. sparksql hive作为数据源

    根据官方文档的说法,要把hive-site.xml,core-site.xml,hdfs-site.xml拷贝到spark的conf目录下,保证mysql已经启动 java public class ...