jquery 實(shí)現(xiàn)地多選框聯(lián)動(dòng)插件

代碼如下:

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

// 前臺(tái)用get方法傳輸<select>標(biāo)簽地屬性name和選中<option>地屬性value

// 后臺(tái)用json格式傳輸數(shù)據(jù)

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

(function($) {

$.fn.extend({

autoselect: function(dest, url) {

return this.each(function() {

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

});

},

});

// 重置復(fù)選框

$.selectreset = function(target) {

if (target != null) {

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

target.empty();

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

}

};

// 加載復(fù)選框

$.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) {

// 綁定聯(lián)動(dòng)鏈

target.data(nextselect, dest);

// 記錄默認(rèn)選項(xiàng)(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);

}

}); // 后臺(tái)以 json 格式傳輸數(shù)據(jù)

} else {

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

}

});

});

};

})(jquery);

：

更多信息請(qǐng)查看IT技術(shù)專欄