jquery.citys.js
13.0 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
/**
* jquery.citys.js 1.0
* http://jquerywidget.com
* Github：https://github.com/mumuy/widget
* -------------- DEMO ---------------
* $('#demo1').citys({valueType:'name',province:'福建',city:'厦门',area:'思明'});
*/
;(function (factory) {
if (typeof define === "function" && (define.amd || define.cmd) && !jQuery) {
// AMD或CMD
define(["jquery"], factory);
} else if (typeof module === 'object' && module.exports) {
// Node/CommonJS
module.exports = function (root, jQuery) {
if (jQuery === undefined) {
if (typeof window !== 'undefined') {
jQuery = require('jquery');
} else {
jQuery = require('jquery')(root);
}
}
factory(jQuery);
return jQuery;
};
} else {
//Browser globals
factory(jQuery);
}
}(function ($) {
$.support.cors = true;
$.fn.citys = function (parameter, getApi) {
if (typeof parameter === 'function') { //重载
getApi = parameter;
parameter = {};
} else {
parameter = parameter || {};
getApi = getApi || function () {
};
}
var dataUrl = 'http://passer-by.com/data_location/list.json';
if (window.ROOT_URL) {
dataUrl = window.ROOT_URL + '/index.php/admin/plugs/region.html';
}
var defaults = {
dataUrl: dataUrl, //数据库地址
crossDomain: true, //是否开启跨域
dataType: 'json', //数据库类型:'json'或'jsonp'
provinceField: 'province', //省份字段名
cityField: 'city', //城市字段名
areaField: 'area', //地区字段名
valueType: 'code', //下拉框值的类型,code行政区划代码,name地名
code: 0, //地区编码
province: 0, //省份,可以为地区编码或者名称
city: 0, //城市,可以为地区编码或者名称
area: 0, //地区,可以为地区编码或者名称
required: true, //是否必须选一个
nodata: 'hidden', //当无数据时的表现形式:'hidden'隐藏,'disabled'禁用,为空不做任何处理
onChange: function () { //地区切换时触发,回调函数传入地区数据
}
};
var options = $.extend({}, defaults, parameter);
return this.each(function () {
//对象定义
var _api = {};
var $this = $(this);
var $province = $this.find('select[name="' + options.provinceField + '"]'),
$city = $this.find('select[name="' + options.cityField + '"]'),
$area = $this.find('select[name="' + options.areaField + '"]');
$.ajax({
url: options.dataUrl,
type: 'GET',
crossDomain: options.crossDomain,
dataType: options.dataType,
jsonpCallback: 'jsonp_location',
success: function (data) {
var province, city, area, hasCity;
if (options.code) { //如果设置地区编码，则忽略单独设置的信息
var c = options.code - options.code % 1e4;
if (data[c]) {
options.province = c;
}
c = options.code - (options.code % 1e4 ? options.code % 1e2 : options.code);
if (data[c]) {
options.city = c;
}
c = options.code % 1e2 ? options.code : 0;
if (data[c]) {
options.area = c;
}
}
var updateData = function () {
province = {}, city = {}, area = {};
hasCity = false; //判断是非有地级城市
for (var code in data) {
if (!(code % 1e4)) { //获取所有的省级行政单位
province[code] = data[code];
if (options.required && !options.province) {
if (options.city && !(options.city % 1e4)) { //省未填，并判断为直辖市
options.province = options.city;
} else {
options.province = code;
}
} else if (isNaN(options.province) && data[code].indexOf(options.province) > -1) {
options.province = code;
}
} else {
var p = code - options.province;
if (options.province && p > 0 && p < 1e4) { //同省的城市或地区
if (!(code % 100)) {
hasCity = true;
city[code] = data[code];
if (options.required && !options.city) {
options.city = code;
} else if (isNaN(options.city) && data[code].indexOf(options.city) > -1) {
options.city = code;
}
} else if (p > 8000) { //省直辖县级行政单位
city[code] = data[code];
if (options.required && !options.city) {
options.city = code;
} else if (isNaN(options.city) && data[code].indexOf(options.city) > -1) {
options.city = code;
}
} else if (hasCity) { //非直辖市
var c = code - options.city;
if (options.city && c > 0 && c < 100) { //同个城市的地区
area[code] = data[code];
if (options.required && !options.area) {
options.area = code;
} else if (isNaN(options.area) && data[code].indexOf(options.area) > -1) {
options.area = code;
}
}
} else {
area[code] = data[code]; //直辖市
if (options.required && !options.area) {
options.area = code;
} else if (isNaN(options.area) && data[code].indexOf(options.area) > -1) {
options.area = code;
}
}
}
}
}
};
var format = {
province: function () {
$province.empty();
if (!options.required) {
$province.append('<option value=""> - 请选择 - </option>');
}
for (var i in province) {
$province.append('<option value="' + (options.valueType === 'code' ? i : province[i]) + '" data-code="' + i + '">' + province[i] + '</option>');
}
if (options.province) {
var value = options.valueType === 'code' ? options.province : province[options.province];
$province.val(value);
}
this.city();
},
city: function () {
$city.empty();
if (!hasCity) {
$city.css('display', 'none');
} else {
$city.css('display', '');
if (!options.required) {
$city.append('<option value=""> - 请选择 - </option>');
}
if (options.nodata === 'disabled') {
$city.prop('disabled', $.isEmptyObject(city));
} else if (options.nodata === 'hidden') {
$city.css('display', $.isEmptyObject(city) ? 'none' : '');
}
for (var i in city) {
$city.append('<option value="' + (options.valueType === 'code' ? i : city[i]) + '" data-code="' + i + '">' + city[i] + '</option>');
}
if (options.city) {
var value = options.valueType === 'code' ? options.city : city[options.city];
$city.val(value);
} else if (options.area) {
var value = options.valueType === 'code' ? options.area : city[options.area];
$city.val(value);
}
}
this.area();
},
area: function () {
$area.empty();
if (!options.required) {
$area.append('<option value=""> - 请选择 - </option>');
}
if (options.nodata === 'disabled') {
$area.prop('disabled', $.isEmptyObject(area));
} else if (options.nodata === 'hidden') {
$area.css('display', $.isEmptyObject(area) ? 'none' : '');
}
for (var i in area) {
$area.append('<option value="' + (options.valueType === 'code' ? i : area[i]) + '" data-code="' + i + '">' + area[i] + '</option>');
}
if (options.area) {
var value = options.valueType === 'code' ? options.area : area[options.area];
$area.val(value);
}
}
};
//获取当前地理信息
_api.getInfo = function () {
var status = {
direct: !hasCity,
province: data[options.province] || '',
city: data[options.city] || '',
area: data[options.area] || '',
code: options.area || options.city || options.province
};
return status;
};
//事件绑定
$province.on('change', function () {
options.province = $(this).find('option:selected').data('code') || 0; //选中节点的区划代码
options.city = 0;
options.area = 0;
updateData();
format.city();
options.onChange(_api.getInfo());
});
$city.on('change', function () {
options.city = $(this).find('option:selected').data('code') || 0; //选中节点的区划代码
options.area = 0;
updateData();
format.area();
options.onChange(_api.getInfo());
});
$area.on('change', function () {
options.area = $(this).find('option:selected').data('code') || 0; //选中节点的区划代码
options.onChange(_api.getInfo());
});
//初始化
updateData();
format.province();
if (options.code) {
options.onChange(_api.getInfo());
}
getApi(_api);
}
});
});
};
}));