`
lishaorui
  • 浏览: 149571 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

市区二级联动下拉框

阅读更多
最近在项目中,用到二级联动下拉框,纯js的。记录下。

其中,这些主要由Area.js实现。(此为在网上找的,修改了下)

主要记录下,在修改页面时,让市、区默认选中。

  
  // 下面代码中用到ext,也可以通过传统方式来实现
  Init();
  		
  var citySel = Ext.getDom("Select1");
  var city = Ext.getDom("xiangmudishi").value;
  for(i=0;i<citySel.options.length;i++) {
      if(city == citySel.options[i].value){
          citySel.options[i].selected = true;
          selectCity();
          var countySel = Ext.getDom("Select2");
          var county = Ext.getDom("xiangmuquxian").value;
          for(j=0;j<countySel.options.length;j++){
              if(county == countySel.options[j].value){
                  countySel.options[j].selected = true;
                  break;
              }
          }
          break;
      }
  }


下面是页面需要用到的关键域,其他略去
  <!-- 用于接收修改前的原数据,此处为了方便记录,写死-->
  <input type="hidden"  id="xiangmudishi" value="西安市"/>
  <input type="hidden"  id="xiangmuquxian" value="高新区"/>
  
  <select id="Select1" name="xiangMu.dishi" onchange="selectCity();">  </select>

  <select id="Select2" name="xiangMu.quxian" > </select>
分享到:
评论

相关推荐

    HTML二级联动下拉列表框的实现,如选择 省,市.zip

    "两个下拉框联动,二级联动下拉框.png"可能是这个功能的截图,而".url"文件则是一个指向Callie在新浪博客上关于该话题的链接,提供了更多详细信息和示例。 总的来说,HTML二级联动下拉列表框的实现涉及HTML、...

    基于Ajax的二级联动下拉列表.rar

    在二级联动下拉列表中,通常有两个或多个下拉框,第一个下拉框的选择会影响第二个下拉框的选项。例如,当用户在第一个下拉框中选择省份时,第二个下拉框会根据所选省份加载对应的市区列表。这种联动效果是通过监听第...

    最全省市区三级联动excel表格

    标题中的“最全省市区三级联动excel表格”指的是一个专门设计用于实现中国省、市、区三级数据联动的Excel表格模板。这种表格通常用于数据管理、统计分析或在Web应用程序中创建下拉选择框,以便用户可以按顺序选择...

    jQuery省市区三级联动下拉框特效代码

    在这个案例中,我们将深入探讨如何使用jQuery实现省市区三级联动下拉框特效。 首先,`jQuery省市区三级联动下拉框`这个项目是基于`jquery-1.8.2.min.js`构建的,这意味着它依赖于jQuery 1.8.2版本。jQuery是一个...

    省市二级联动

    省市二级联动是网页开发中常见的一种交互功能,主要用于表单中的地址选择,用户先选择省份,然后根据省份自动填充对应的市区。这种功能提高了用户输入的效率,也为后台数据处理提供了便利。下面将详细介绍如何实现...

    JavaWeb通过ajax、json实现省市二级联动

    在JavaWeb开发中,省市二级联动是一项常见的功能,它允许用户在选择省份后,自动加载出对应的市区选项。这项功能的实现通常涉及到前端JavaScript技术,如AJAX(Asynchronous JavaScript and XML)和JSON(JavaScript...

    省市三级联动

    当二级城市被选中时,再加载并显示对应的三级市区数据。整个过程中,需要确保数据的同步和更新,以保持联动效果的顺畅。 二、应用场景 省市三级联动广泛应用于电子商务、物流配送、在线报名、地图服务等需要用户...

    利用数据库实现的省市二级联动的ASP源程序 安徽机电职业技术学院陈伟

    省市二级联动是Web开发中常见的功能,主要用于在前端选择省份时自动填充对应的市区选项,以提供用户更加便捷的交互体验。这种技术常用于地址输入、物流配送等场景。本实例由安徽机电职业技术学院陈伟提供的ASP源程序...

    js世界主要地区省市区三级联动.zip

    在省市区选择的例子中,当你在第一级选择一个国家时,第二级会显示出该国的所有省份;接着,当你选择一个省份,第三级则会加载并展示该省的市和区。 这个JS效果利用了DOM(Document Object Model)操作,通过监听...

    js实现二级联动简单实例

    在JavaScript中,二级联动是一种常见的交互设计,主要用于多级选择场景,如省市区选择、分类筛选等。本文将详细解析如何使用JavaScript实现一个简单的二级联动效果。 首先,我们需要了解二级联动的基本概念。二级...

    省市区县多级下拉联动选框[相关的一些资料].rar

    当用户在一级下拉框中选择一个省,程序会根据该省的ID查找并填充二级下拉框的市选项;同理,选择市后,会更新三级下拉框的区县选项。 在实际开发中,我们可以使用各种前端框架或库来简化这一过程。例如,使用Vue.js...

    vue2省市区三级联动,mysql,html/jsp,js/json

    三级联动通常涉及到三个下拉框(省、市、区),当用户在第一级选择时,第二级的选项会根据第一级的选择动态更新,同理,第三级也会跟随前两级的变化。 MySQL是广泛使用的开源关系型数据库管理系统,用于存储和管理...

    中级excel实战训练-1

    例如,一级下拉框选择省份,二级下拉框则根据所选省份显示对应的市区。这种联动下拉框可以借助Excel的依赖关系和数据验证规则实现,有助于简化复杂数据的输入和管理。 以上这些技能的掌握,不仅可以提高数据处理的...

Global site tag (gtag.js) - Google Analytics