jQuery全选反选插件,经易让你实现一个表单列表数据的全选与取消全选功能,内含示例,小巧实用。自动判断当前选中数量,加上全选。在没有jQuery之前,我们需要一大段js代码来实现这种效果。有了jQuery这个强大的库之后,我们可以很方便的开发实现这种效果的jQuery插件。我将它命名为jQuery.fn.check插件。前端框架分享
在构建我们的插件之前,我们想考虑一下其功能需求:
所有复选框的状态都随全选复选框的状态而发生变化;如果所有复选框都被选中时,全选复选框立即处于选中状态;如果当前选中复选框的数量小于复选框的总数时,全选复选框立即处于非选中状态; 所以,在那些处于全选复选框控制之下的复选框全被点击时,就需要时刻判断当前被选中复选框的个数,从而决定全选复选框是否被选中。
如有如下复选框:
<p><input type="checkbox" name="checkall" />全选</p> <p><input type="checkbox" name="check" />单选1</p> <p><input type="checkbox" name="check" />单选2</p> <p><input type="checkbox" name="check" />单选3</p>
jQuery全选返选插件及调用如下。前端框架分享
$(function () { //调用全选插件 $.fn.check({ checkall_name: "checkall", checkbox_name: "check" }) }); //全选插件 //checkall_name 操作全选的复选框name //checkbox_name 被操作的复选框的name name值可不统一 设置包含值 以XXX开头 自己修改 (function ($) { $.fn.check = function (options) { var defaults = { checkall_name: "checkall_name", //全选框name checkbox_name: "checkbox_name" //被操作的复选框name }, ops = $.extend(defaults, options); e = $("input[name='" + ops.checkall_name + "']"), //全选 f = $("input[name='" + ops.checkbox_name + "']"), //单选 g = f.length; //被操作的复选框数量 f.click(function () { $("input[name ='" + ops.checkbox_name + "']:checked").length == $("input[name='" + ops.checkbox_name + "']").length ? e.attr("checked", !0) : e.attr("checked", !1); }), e.click(function () { for (i = 0; g > i; i++) f[i].checked = this.checked; }); }; })(jQuery);
相关推荐
jquery全选反选插件
jquery实现全选反选全不选案例,在入场网页开发中实现。
Jquery全选反选Checkbox 简单好用 复用性很好 欢迎下载
jQuery全选反选及批量删除
jQuery表格行全选反选单选代码,例子采用bootstrap格式,可以选择自定义。
DataGridView表头添加checkbox实现全选反选
静态图通过jquery实现全选反选取消删除功能。
android checkbox全选反选
jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值
jQuery下拉框可搜索 全选反选插件ASelect.js.zip
JS实现全选反选全不选
jQuery实现全选反选操作案例 本文实例为大家分享了jQuery实现全选反选操作的具体代码,供大家参考,具体内容如下 全选+反选 可根据控制台结合查看结果 <!DOCTYPE html> <html lang="en"> <head> ...
列表左右选择全选反选插件
Javascript实现全选反选 Javascript绑定事件
jquery Checkbox 全选 反选 全不选 多种实现方法 和表单验证
jQuery表格行全选反选插件
JS简单表格列表全选反选代码,原生JS,点击表头按钮,实现全选、反选操作,实用的网页代码。
demo46-jQuery全选,反选,取消选择.html
jquery复选框的全选反选等操作
实现全选,全不选,反选,获取选中的值 。