标题 | jquery实现的多选框多级联动插件 |
内容 | 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); : |
随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。