<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

      <title>二级联动</title>

      <script src="http://apps.bdimg.com/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>

        <script type="text/javascript">

         $(document).ready(function(){

            $("#province").change(function(){

               $("#province option").each(function(i,o){

                    if($(this).attr("selected"))

                    {

                      $(".city").hide();

                       $(".city").eq(i).show();

                  }

               });

            });

         $("#province").change();

      });

 </script>

 </head>

 <body>

      <select id="province">

        <option>----请选择省份----</option>

        <option>北京</option>

       <option>上海</option>

        <option>江苏</option>

    </select>

    <select class="city">

            <option>----请选择城市----</option>

    </select>

    <select class="city">

        <option>东城</option>

        <option>西城</option>

        <option>崇文</option>

        <option>宣武</option>

        <option>朝阳</option>

    </select>

 <select class="city">

        <option>黄浦</option>

        <option>卢湾</option>

        <option>徐汇</option>

         <option>长宁</option>

         <option>静安</option>

     </select>

     <select class="city">

         <option>南京</option>

         <option>镇江</option>

         <option>苏州</option>

         <option>南通</option>

         <option>扬州</option>

     </select>

 </body>

 </html>

jquery实现2级联动的更多相关文章

  1. Jquery实现两级联动

    最后结果如下: 关键代码如下: <select name="customerCondition['credibilityBegin']" id="credibili ...

  2. 如何根据Jquery实现两级联动

    <script language="javascript" type="text/javascript" > $(function (){      ...

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

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

  4. JS 实现地区，省份，城市，县区4级联动

    刚学JS,实战一下,做一个省份信息4级联动. 但是网上查了都是3级的,没有4级,现在做一个的是带地区的4级联动,最简单的办法是修改别人的代码,最开始找到的事类似于下边这个的: 省市县关联菜单 < ...

  5. 使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能

    使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能 要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下 ...

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

    省市区联动下拉效果在WEB应用中使用非常广泛,尤其在一些会员信息系统.电商网站最为常见,开发者一般使用AJAX实现无刷新下拉联动. 本文将讲述利用jQuery插件,通过读取JSON数据,实现无刷新动态 ...

  7. 简单jquery实现select三级联动

    简单的jquery实现select三级联动 代码如下: <!DOCTYPE html> <html> <head> <meta charset="u ...

  8. Devexpress TreeList选择父级联动

    Treelist当显示复选框后,父级和子级的复选框没有关联,使用过程中很不便,如图所示 自己给treelist添加父子级联动 /// <summary> /// 初始化TreeList,父 ...

  9. 手机端仿ios的省市县3级联动脚本一

    一,图片实例 二,代码 2.1,代码 $('#provinceCity_fu').click(function(){ var $this = $(this); new Picker({ "t ...

随机推荐

  1. 【转】python的内存管理机制

    http://developer.51cto.com/art/201007/213585.htm 内存管理,对于Python这样的动态语言,是至关重要的一部分,它在很大程度上甚至决定了Python的执 ...

  2. iOS开发笔记系列-基础5(分类和协议)

    分类 在Objective-C中,除了通过新建子类的方式来向类添加新方法外,还可以通过分类的方式.分类提供了一种简单的方式,将类的定义模块化到相关方法的组或分类中,它还提供了扩展现有类定义的简便方式, ...

  3. Codeforces Round #333 (Div. 1) B. Lipshitz Sequence 倍增 二分

    B. Lipshitz Sequence Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/601/ ...

  4. 不可不表的OSG智能指针之强指针与弱指针 《转载》

    不可不表的OSG智能指针之强指针与弱指针 <转载> 使用OSG的人都知道OSG的内存管理方式采用了智能指针,通过智能指针的方式让OSG自己处理对象的销毁工作.在OSG中有两个智能指针类型, ...

  5. utf-8 和gbk编码的差别

    UTF- 8: 是用以解决国际上字符的一种多字节编码,它对英文使用8位(即一个字节),中文使用24为(三个字节)来编码. GBK 是国家标准GB2312基础上扩容后兼容GB2312的标准. GBK的文 ...

  6. delphi HTML代码

    ################################属性 设置################################################字体设置{//-------- ...

  7. 通过ulimit改善linux系统性能(摘自IBM)

    本文介绍了 ulimit 内键指令的主要功能以及用于改善系统性能的 ulimit 用法.通过这篇文章,读者不仅能够了解 ulimit 所起的作用.而且能够学会怎样更好地通过 ulimit 限制资源的使 ...

  8. HTML转换成word文档

    1工具类保存word文件 public class WordAction { public static void SaveAsWord(string fileName, string pFileNa ...

  9. 实例源码--Android理财工具源码

      下载源码   技术要点: 1.Sqlite数据库的综合使用 2.控件的综合使用 3. 源码带详细的中文注释 ...... 详细介绍: 1. Sqlite数据库的综合使用 本套源码采用了Sqlite ...

  10. C#文件操作系列(一)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.I ...