jquery 实现地多选框联动插件

代码如下:

// 使用：$(_event_src_).autoselect(_reload_, reload_url);

// 前台用get方法传输<select>标签地属性name和选中<option>地属性value

// 后台用json格式传输数据

// 格式: { value:<option>地属性value, text:<option>地显示文本 }

(function($) {

$.fn.extend({

autoselect: function(dest, url) {

return this.each(function() {

$.selectchange($(this), $(dest), url);

});

},

});

// 重置复选框

$.selectreset = function(target) {

if (target != null) {

$.selectreset(target.data(nextselect));

target.empty();

target.append(target.data(defaultopt));

}

};

// 加载复选框

$.selectload = function(target, data) {

$.each(data, function(index, content) {

var option = $(<option></option>)

.attr(value, content.value).text(content.text);

target.append(option);

});

};

// 绑定 change 事件

$.selectchange = function(target, dest, url) {

// 绑定联动链

target.data(nextselect, dest);

// 记录默认选项(first option)

if (target.data(defaultopt) == null)

target.data(defaultopt, target.children().first());

dest.data(defaultopt, dest.children().first());

$(document).ready(function() {

target.change(function(event) {

var _target = event.target || window.event.srcelement;

if (_target.value != target.data(defaultopt).attr(value)) {

$.getjson(url, {

name: _target.name,

value: _target.value

}, function(data, status) {

if (status == success) {

$.selectreset(target.data(nextselect));

$.selectload(target.data(nextselect), data);

}

}); // 后台以 json 格式传输数据

} else {

$.selectreset(target.data(nextselect));

}

});

});

};

})(jquery);

：

更多信息请查看IT技术专栏