JS 省市县小区联动

function ShengList() {
    //alert("准备展示省份并调用市");
    $.ajax({
        url: ‘/City/GetProvcnList‘,
        dataType: ‘json‘,
        contentType: ‘application/json;charset=utf-8‘,
        success: function (data) {
            var ProvcnStr = "";
            $("#CityAreaIds").html("");
            $.each(data, function (i, o) {
                ProvcnStr += ‘<option>‘ + o.provcn + ‘</option>‘;
            });
            $("#CityAreaIds").html(ProvcnStr);
            ShiList($("#CityAreaIds").find("option:selected").text());
        }
    });
};
function ShiList(provcn) {
    //alert("准备展示市区并调用县");
    $.ajax({
        data: { "provcn": provcn },
        url: ‘/City/GetCitylist‘,
        dataType: ‘json‘,
        contentType: ‘application/json;charset=utf-8‘,
        success: function (data) {
            var districtcnStr = "";
            $("#City").html("");
            $.each(data, function (i, o) {
                districtcnStr += ‘<option>‘ + o.districtcn + ‘</option>‘;
            });
            $("#City").html(districtcnStr);
            XianList($("#City").find("option:selected").text());
        }
    });
};
function XianList(districtcn) {
    //alert("准备展示县区");
    $.ajax({
        data: { "districtcn": districtcn },
        url: ‘/City/GetXanlist‘,
        dataType: ‘json‘,
        contentType: ‘application/json;charset=utf-8‘,
        success: function (data) {
            var namecnStr = "";
            $("#CityAreaId").html("");
            $.each(data, function (i, o) {
                namecnStr += ‘<option value=‘ + o.areaid + ‘ >‘ + o.namecn + ‘</option>‘;
            });
            $("#CityAreaId").html(namecnStr);
            judge($(‘#CityAreaId option:selected‘).val());
            //getXhpro($(‘#CityAreaId option:selected‘).val());
        }
    });
};
function judge(CityAreaId) {//根据县查询所有的小区
    $.ajax({
        url: ‘/City/GetVillagnamelist‘,
        dataType: ‘json‘,
        data: { "city_areaid": CityAreaId },
        contentType: ‘application/json;charset=utf-8‘,
        success: function (data) {
            var xiaoquStr = "";
            $("#Community").html("");
            $.each(data, function (i, o) {
                xiaoquStr += ‘<option  value=‘ + o.id + ‘>‘ + o.name + ‘</option>‘;
            });
            $("#Community").html(xiaoquStr);
        }
    });
};
$(function () {
    ShengList();

    $("#CityAreaIds").change(function () {
        ShiList($(this).val());
    });
    $("#City").change(function () {
        XianList($(‘#City option:selected‘).text());
    });
    $("#CityAreaId").change(function () {
        judge($(‘#CityAreaId option:selected‘).val());
        getXhpro($(this).val());
    });

});
时间: 2024-08-17 09:49:33

JS 省市县小区联动的相关文章

JS省市县三级联动菜单

<html> <head> <title>JS省市县三级联动菜单丨潜水曝气机</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style> body,select { font-size:9pt; font-family:Verdana; } a { color:red; text-dec

全国最标准的、最完整的省市县三级联动选择 - 大型企业信息化系统集成快速开发平台

在使用通用权限管理系统时,需要经常使用省市县三级联动选择,在网上看到不少这类例子,感觉不是很满足我们的需求, 在使用的时候也用过通用权限系统中的省市县接口,为减少对接口的调用,现将其改为JS文件调用的方式:样式如下 JS文件截图 这个JS文件可根据基础信息中省市县资料的变更重新生成.其自动生成方法调用如下图: 省市县数据基本变化应该很小,为方便大家提供最新生成的JS文件和demo: district.js /* * UPDATE DATE:2015-01-06 22:04:16 songbiao

JavaScript解析XML实现省市县三级联动

JavaScript解析XML实现省市县三级联动,简单易用,只需要一个XML和一个js就能能实现,下载后代开HTML就能看到效果.  原文:JavaScript解析XML实现省市县三级联动 源代码下载地址:http://www.zuidaima.com/share/1550463310056448.htm JavaScript解析XML实现省市县三级联动

jQuery - 全国省市县三级联动

最近有空用jquery做了一个全国省市县的三级联动,在以后或许可以用的到 ,遗憾的是我还没用封装,等有空看能不能封装成一个插件 废话不多说,贴上代码: 1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>下拉框</title> 6 <script src="city.js"></script

asp.net(c#)用Ajax调用web 服务实现省市县三级联动

1.先说说硬件配置,我最开始是在Win7(I7 4770,8G RAM,2T硬盘)里装ubuntu10.10 64位系统(4G RAM,200G 硬盘)进行源码编译,大概花了3个多小时.而且还多次出现outofmemoryerror 错误.最后将硬件升级为I7 4770.16G内存.2T硬盘,不装虚拟机,直接跑Ubuntu 10.10系统,Swap分区为16G,编译一次大概花了40分钟,没有报任何错误. 所以不推荐在虚拟机里面跑. 2.根据官方文档配置编译环境: 官方文档说的是在"发布包/Sof

JS实现全国三级联动

//引用js文件area.js <script src="/javascripts/area.js" type="text/javascript"></script> <li><label>全国 省 市 县 三级级联:</label> <i>*</i> <select id="s_province" name="s_province" c

day01课程回顾,数据类型,(用户登录限制登录三次,购物车,省市县三级联动)

Day01 Python的分类 Cpython:代码àc字节码->机器码   一行一行的编译执行 Pypy:   代码àc字节码->机器码   全部转换完再执行 其他python  代码-->其他字节码-->机器码 Python的执行 Windows:C:\Python35\python.exe    D:\1.txt(python可执行文件路径---解释器   执行文件) Linux:可以在文件的头部写#!/usr/bin/python    python安装路径(用命令wher

【原生js】原生js的省市区三级联动

html: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>全国城市三级联动</title> 6 </head> 7 <body> 8 <div class="info&q

android:省市县三级联动(基于json和spring)

一.请看效果图": 二.程序的代码: 1.MainActivity.java package com.loveplusplus.loader.demo.ui; import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject; import android.app.Activity; import android.os.Bundle; import android.os.Handler; im