下拉框多级联动辅助js,优化您的下拉框
function IniteSelect(options) { $("body").IniteSelect(options) } (function ($) { $.fn.IniteSelect = function (options) { var option = $.extend({}, { ids: [], swType: [], callBack: [], guid: "", BaseUrl: "/ashx/DropDownControl.ashx", split: ";", obj: {}, isGetFirstDrop: true }, options); if (option.ids.length == 0) { return } else { if (option.isGetFirstDrop) { var c = null; if (option.callBack.length > 0) { c = option.callBack[0] } GetSelectData(option.ids[0], option.BaseUrl, $.extend(option.obj, { swType: option.swType[0], guid: option.guid }), c) } for (var i = 0; i < option.ids.length - 1; i++) { BindChange(i, option) } if (!option.isGetFirstDrop && option.ids.length > 1) { $("#" + option.ids[0]).change() } } }; function BindChange(i, option) { $("#" + option.ids[i]).change(function () { var value = $("#" + option.ids[i]).val(); for (var k = i + 1; k < option.ids.length; k++) { var ids = option.ids[k].split(option.split); for (var m = 0; m < ids.length; m++) { $("#" + ids[m] + " > option[value!='-1']").remove() } } var up = i + 1; if (value == "-1") { return } var c = null; if (option.callBack.length >= up) { c = option.callBack[up] } GetSelectData2(option.ids[up], option.BaseUrl, option.swType[up], value, option.split, c, option.obj) }) } function GetSelectData2(ids, url, swTypes, v, split, c, obj) { var teids = ids.split(split); var teswTypes = swTypes.split(split); for (var i = 0; i < teswTypes.length; i++) { if (teswTypes[i] != "") { GetSelectData(teids[i], url, $.extend(obj, { swType: teswTypes[i], guid: v }), c) } } } function GetSelectData(id, url, obj, c) { JQueryPost(url, obj, function (result) { result = eval("(" + result + ")"); var idobj = $("#" + id); $("#" + id + " > option[value!='-1']").remove(); for (var i = 0; i < result.length; i++) { idobj.append("<option value='" + result[i].Value + "'>" + result[i].Text + "</option>") } if (c != null) { window.setTimeout(function () { c() }, 100) } }) } })(jQuery);
使用方法:IniteSelect({ ids: ['agentId', 'orgId', 'schoolId','departid/classid'], swType: ['GetAllAgent', 'GetOrgDrop', 'GetSchoolDrop','GetSchoolDepart/GetSchoolClass'] });
做地址或者查询级联效果非常不错,可以指定传参和初始传参。也可以指定服务端url。