`
z_piaoyi
  • 浏览: 22950 次
  • 性别: Icon_minigender_2
  • 来自: 河北
社区版块
存档分类
最新评论

jquery实现三级联动

阅读更多

$(document).ready(function(){
    $("#province").width("70");
    $("#city").width("70");
    $("#mysub").click(submit);//为提交按钮加监听器
    
    $("#province > option").remove();
    //省份查询方法
    $.ajax({
     url:"queryprovince.1003?method=queryprovince",
     type:'POST',
      success: function(msg){
       var arr = eval("("+msg+")");
       for(var i=0;i<arr.length;i++){
        var name = arr[i].name;
        $("#province").append($("<option>"+name+"</option>"));
       }
      }
    });
    
    //城市查询方法
    $("#province").change( function() {
     
     $("#city > option").remove();
     $("#area > option").remove();
     //alert($("#province").val());
     $.ajax({
      url:"querycity.1003?method=querycity",
      type:'POST',
      data: "province="+$("#province").val(),
       success: function(msg){
        var arr = eval("("+msg+")");
        for(var i=0;i<arr.length;i++){
         var name = arr[i].name;
         $("#city").append($("<option>"+name+"</option>"));
        }
       }
     });
  });
  
  
  //区县查询方法
    $("#city").change(function(){
     $("#area > option").remove();
     $("#city").width("70");
     //alert($("#area").val());
     $.ajax({
      url:"queryarea.1003?method=queryarea",
      type:'POST',
      data: "city="+$("#city").val(),
       success: function(msg){
        var arr = eval("("+msg+")");
        for(var i=0;i<arr.length;i++){
         var name = arr[i].name;
         $("#area").append($("<option>"+name+"</option>"));
        }
       }
     });
    });
   });

分享到:
评论

相关推荐

    Jquery实现三级联动

    在网页开发中,"Jquery 实现三级联动"是一个常见的交互功能,特别是在处理地理信息或者层级数据时。这个功能允许用户在三个下拉菜单(通常是省、市、区/县)之间进行选择,每次选择一个级别后,下一级别的选项会根据...

    jquery +div 实现三级联动 ,可自定义样式

    在这个主题中,我们将深入探讨如何使用jQuery、AJAX、div以及CSS来实现一个可自定义样式的三级联动效果。 首先,让我们来看看传统的jQuery + AJAX + select实现的联动。在这个方法中,我们通常使用jQuery的事件监听...

    jquery三级联动树

    标题中的"jQuery三级联动树"就是一个利用jQuery库实现的,可以展示省、市、县(或区)三级递进关系的下拉菜单系统。 jQuery是一个轻量级、高性能的JavaScript库,它简化了HTML文档遍历、事件处理、动画设计和Ajax...

    jquery实现城市三级联动效果

    下面我们将详细探讨如何使用jQuery实现城市三级联动效果。 首先,我们需要理解什么是联动效果。联动效果是指在一个下拉菜单(或其他选择器)的选择发生变化时,自动更新另一个或多个相关下拉菜单的内容。在城市三级...

    前端jquery+后端servlet实现三级联动项目省市区

    这个项目“前端jquery+后端servlet实现三级联动项目省市区”就是一个典型的案例,它展示了如何利用jQuery在前端处理用户交互,以及如何通过Servlet在后端进行数据处理和传输。下面我们将详细探讨这个项目中的关键...

    jquery实现的水平三级联动

    在IT领域,尤其是在网页开发中,"jQuery实现的水平三级联动"是一种常见的交互设计,用于增强用户界面的交互性和信息的层次展示。本知识点主要涉及jQuery库的使用、HTML结构设计、CSS样式调整以及JavaScript事件处理...

    jquery ajax 三级联动

    在三级联动中,jQuery主要负责监听用户的选择事件,并触发Ajax请求。 接下来是AJAX(异步JavaScript和XML),它允许Web应用在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。在三级联动中,每当用户...

    jquery省市三级联动.rar

    本示例中的"jquery省市三级联动.rar"是一个使用jQuery实现的省市三级联动效果的示例代码。这个功能常用于网页上的地址选择,用户在选择省份后,下拉菜单会自动更新为对应省份的城市,接着选择城市后,再次更新为该...

    jQuery日期三级联动,包含js和示例页面

    本主题将深入探讨如何使用jQuery实现一个日期三级联动的效果,这是一个常见于用户输入生日或其他时间信息的功能。 一、jQuery基础 jQuery的核心在于其简洁的语法,例如选择元素、操作DOM(文档对象模型)以及处理...

    Jquery实现省市区三级联动多选.zip

    "Jquery实现省市区三级联动多选"是一个典型的前端技术应用,它解决了传统二级联动或三级联动一对一模式的问题,引入了多选功能,使得用户在选择省市区时可以有更大的自由度。 一、jQuery简介 jQuery是一个快速、...

    jquery 版三级联动

    "jquery 版三级联动"是指利用jQuery实现的一种交互效果,常见于下拉菜单或者地区选择器等场景,用户选择每一级选项时,下一级的选择会根据当前选择动态更新。这种功能在网页设计中很常见,可以提高用户体验。 在...

    jquery三级联动示例

    在本示例中,“jquery三级联动”是指利用jQuery实现的省份、城市、区县的联动下拉菜单效果。这种功能常见于需要用户选择详细地理位置的网页表单中,如物流配送、地址填写等场景。 首先,我们来理解“三级联动”的...

    Jquery实现省市区/县三级联动的Javascript脚本

    Jquery实现省市区/县三级联动的Javascript脚本

    Jquery 三级联动

    在网页开发中,jQuery 三级联动是一种常见的交互设计,它通常用于实现下拉菜单的联动效果,例如在选择省份后自动加载对应的市、区/县数据。这种功能常见于地址选择、分类筛选等场景,提高了用户操作的便捷性和效率。...

    省市区三级联动(jQuery+Json)

    在网页开发中,"省市区三级联动"是一...总结,"省市区三级联动"功能的实现主要依赖于jQuery进行DOM操作和事件处理,以及Json作为数据传输和存储的格式。通过合理的前端设计和优化,可以提供流畅、高效的用户交互体验。

    jQuery实现三级联动效果

    本文详细介绍了使用jQuery实现三级联动效果的方法,这种方法在网页设计中非常常见,尤其适用于电子商务网站、在线调查表单以及任何需要通过下拉列表选项来筛选数据的场景。三级联动一般指的是三个下拉选择框联动,...

    jquery省市区三级联动下拉菜单_select三级联动下拉菜单

    jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动...

    Jquery 省市区县三级联动代码

    本文将详细介绍如何使用Jquery实现这种三级联动效果,以及涉及的相关文件和数据结构。 首先,`可初始化省市县三级联动.html`是主页面,它包含了HTML结构以及Jquery脚本的引用。在这个HTML文件中,通常会有三个下拉...

    SSH结合jquery实现三级联动效果

    SSH结合jquery实现三级联动效果的详细知识点可以分为以下几个部分: 1. 三级联动效果的概念: 三级联动是指在网页上通过用户选择下拉列表中的某一个选项,自动更新其他两个下拉列表的内容,以达到数据联动的目的。...

Global site tag (gtag.js) - Google Analytics