(function ($) {
$.fn.Address = function (options) {
var defaults = {
divid: "Address",
callback: function (pageindex) {
}
};
var opts = $.extend(defaults, options);
var AddressHtml = "";
AddressHtml = ("<span class=\"province\" ><select id=\"Pro\" name=\"Region_Province\"></select></span>" +
"" + "<span class=\"province\" ><select id=\"city\" name=\"Region_City\"><option>地级市</option></select></span>" +
"" + "<span class=\"province\"><select id=\"area\" name=\"Region_Xian\"><option >市县级市</option></select></span>" +
"" + "<span class=\"fillin\"><input type=\"text\" id=\"addressdetial\" name=\"Region_Detail\"></span>" +
"" + "<span id=\"addressdetialSpan\" style=\"padding-left:10px;padding-top:3px;\"></span>");
$("#" + opts.divid).html(AddressHtml);
$.ajax({
type: "get",
contentType: 'text/json',
url: "/common/read",
dataType: "json",
success: function (data) {
var html = "<option value='0'>省份</option>";
$.each(data, function (i, dataitem) {
html = html + "<option value='" + dataitem.Code + "'>" + dataitem.Name + "</option>";
});
$("#Pro").html(html);
}
});
$("#Pro").change(function () {
var code = $("#Pro").find("option:selected").val();
$.ajax({
type: "get",
contentType: 'text/json',
url: "/common/ReadSecond",
dataType: "json",
data: { parentId: code, level: 2 },
success: function (data) {
var html = "<option value='0'>地级市</option>";
$.each(data, function (i, dataitem) {
html = html + "<option value='" + dataitem.Code + "'>" + dataitem.Name + "</option>";
});
$("#city").html(html);
$("#area").html("<option value='0'>市县级市</option>");
}
});
});
$("#city").change(function () {
var code = $("#city").find("option:selected").val();
$.ajax({
type: "get",
contentType: 'text/json',
url: "/common/ReadSecond",
dataType: "json",
data: { parentId: code, level: 3 },
success: function (data) {
var html = "<option value='0'>市县级市</option>";
$.each(data, function (i, dataitem) {
html = html + "<option value='" + dataitem.Code + "'>" + dataitem.Name + "</option>";
});
$("#area").html(html);
}
});
}); }; })(jQuery);

  

jq实现地址级联效果的更多相关文章

  1. [C#]使用 C# 代码实现拓扑排序 dotNet Core WEB程序使用 Nginx反向代理 C#里面获得应用程序的当前路径 关于Nginx设置端口号,在Asp.net 获取不到的,解决办法 .Net程序员 初学Ubuntu ,配置Nignix 夜深了,写了个JQuery的省市区三级级联效果

    [C#]使用 C# 代码实现拓扑排序   目录 0.参考资料 1.介绍 2.原理 3.实现 4.深度优先搜索实现 回到顶部 0.参考资料 尊重他人的劳动成果,贴上参考的资料地址,本文仅作学习记录之用. ...

  2. JavaScript 省市级联效果

    JavaScript 省市级联效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  3. JavaScript实现省市级联效果实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  4. bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. javascript中的省市级联效果

    学习javascript的时候都遇到过这样的需求,不仅是省市,还有其他的一些场景,看看关键的代码有哪些吧. <head runat="server"> <titl ...

  6. 用扩展方法实现DevExpress-GridControl级联效果

    首先,让我们先回顾下.Net中扩展方法的特征: 1.  必须在一个非嵌套.非泛型的静态类中: 2.  至少有一个参数(this 作前缀的参数): 3.  第一个参数必须附加this做前缀: 4.  第 ...

  7. WPF MVVM模式下ComboBox级联效果 选择第一项

    MVVM模式下做的省市区的级联效果.通过改变ComboBox执行命令改变市,区. 解决主要问题就是默认选中第一项 1.首先要定义一个属性,继承自INotifyPropertyChanged接口.我这里 ...

  8. 纯js实现省市级联效果

    我们都知道一般有注册的时候会让用户填入省市啊地区什么的,然后我就想使用纯js制作一个省市级联的效果,只是用于学习以及回顾温习用,首先看下效果图,界面很丑啊,不要嫌弃! 首先还是先看下我的项目目录吧 很 ...

  9. Next Cloud通过修改数据库表,达到替换文件而不改变分享的链接地址的效果,以及自定义分享链接地址

    Next Cloud如何通过修改数据库表,达到替换文件而不改变分享的链接地址的效果,以及自定义分享的链接地址 本文首发于我的个人博客:https://chens.life/nextcloud-chan ...

随机推荐

  1. Yarn中的几种状态机

    1 概述 为了增大并发性,Yarn采用事件驱动的并发模型,将各种处理逻辑抽象成事件和调度器,将事件的处理过程用状态机表示.什么是状态机? 如果一个对象,其构成为若干个状态,以及触发这些状态发生相互转移 ...

  2. mongdb创建自增主键(primary key)的相关讨论 - Jason.Zhi

    根据mongodb官方文档介绍,如果在插入(insert)操作时,没有指定主键id,那么它会自动给插入行自动附上一个主键id.看起来不错,但是详细看看,就会发现这个id值有点复杂. 如下图: mong ...

  3. 通过扩展让ASP.NET Web API支持JSONP -摘自网络

    同源策略(Same Origin Policy)的存在导致了“源”自A的脚本只能操作“同源”页面的DOM,“跨源”操作来源于B的页面将会被拒绝.同源策略以及跨域资源共享在大部分情况下针对的是Ajax请 ...

  4. 二十八个 HTML5 特性与技巧

    1. New Doctype  你还在使用令人讨厌的难记的XHTML文档类型声明吗?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...

  5. WIN7 WIN8 笔记本无线网卡MAC地址修改

    找了好久,尝试了好多种方法,最后终于在下面的网址里找到了解决方案 http://jingyan.baidu.com/article/ceb9fb10e32bce8cac2ba04a.html 使用MA ...

  6. Telnet连接Win7系统被拒绝的原因及解决方法

    有时要与计算机进行远程连接,会用到telnet.win7中telnet默认是没有开启的,所以这时连接会连接失败,其失败提示如下: 正在连接192.168.100.103...无法打开到主机的连接. 在 ...

  7. 51Nod 1405 树的距离之和 (树dp)

    题目链接:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1405 中文题面不解释了,两次dfs,第一次自下向上,第二次自上 ...

  8. HDU1151Air Raid(二分图的最大匹配)

    题目大意: 有一个城镇,它的所有街道都是单行的,并且每条街道都是和两个路口相连.同时已知街道不会形成回路. 你的任务是编写程序求最小数量的伞兵,这些伞兵可以访问(visit)所有的路口.

  9. 结构类模式(一):适配器(Adapter)

    定义 适配器模式把一个类的接口变换成客户端所期待的另一种接口,从而使原本因接口不匹配而无法在一起工作的两个类能够在一起工作. 类适配器模式 使用继承的方式实现没有提供的接口从而达到适配到新系统的需求. ...

  10. Mahout之Canopy Clustering深入理解

    转自:http://www.cnblogs.com/vivounicorn/archive/2011/09/23/2186483.html Mahout学习——Canopy Clustering 聚类 ...