一个简单的全选Jquery插件
在实际开发中全选操作会经常用到,这里简单的写了个Jquery的全选插件,方便以后直接调用
[javascript]
/*
* jQuery lightweight plugin CheckAll
* Original author: Suifengshiqu
* Further changes, comments: lvbo1988@gmail.com
*/
/* 表格全选插件 */
/* 使用方法 */
/*
$("#tab").CheckAll({ valueField: "txtTest", chkId: "chkall", splitExp: "|", valueIndex: 0 });
*/
(function ($) {
$.fn.extend({
CheckAll: function (options) {
var defaults = {
valueField: null, //默认选中后的赋值字段
chkId: "c_all", //全选框的Id
splitExp: "_", //字段分隔符号
valueIndex: 1 //分割后取值的索引下标
};
var options = $.extend(defaults, options);
obj = $(this); //默认为table
function _getSelectedValue() {
var values = "";
$("#" + obj.attr("Id") + " :checked").each(function () {
if ($(this).attr("id") != options.chkId) {
values += $(this).attr("id").split(options.splitExp)[options.valueIndex] + ",";
}
});
if (values.length > 0)
return values.substring(0, values.length - 1);
return values;
}
return this.each(function () {
var subExp = "#" + obj.attr("Id") + " :checkbox";
var chks = $(subExp + ":gt(0)");
var checkedCount = 0;
chks.each(function () {
$(this).click(function () {
if ($(this).attr("checked")) {
checkedCount += 1;
} else {
checkedCount -= 1;
}
if (checkedCount < chks.length) {
$("#" + options.chkId).attr("checked", false);
} else {
$("#" + options.chkId).attr("checked", true);
}
$("#" + options.valueField).val(_getSelectedValue());
});
});
$("#" + options.chkId).click(function () {
$(subExp).attr("checked", $(this).attr("checked") ? true : false);
if ($(this).attr("checked")) {
$(subExp).attr("checked", true);
checkedCount = $(subExp + ":gt(0)").length;
} else {
$(subExp).attr("checked", false);
checkedCount = 0;
补充:web前端 , JavaScript ,