zoukankan      html  css  js  c++  java
  • checkbox 选中、取值处理

    [1].[代码] checkbox 选中、取值处理 跳至 [1]

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    /****处理checkbox 配合jquery,layer 使用****/
    var handleCheckbox;
     
    function HandleCheckbox(className) {
        this.className = className;
    };
     
    //全选
    HandleCheckbox.prototype.Select = function() {
        $("[class='" + this.className + "']:checkbox").prop("checked", true);
    };
     
    //取消全选
    HandleCheckbox.prototype.unSelect = function() {
        $("[class='" + this.className + "']:checkbox").removeAttr("checked");
    };
     
    //获取 checkbox 实例
    HandleCheckbox.prototype.GetInstance = function() {
     
        var Instances = $("[class='" + this.className + "']:checkbox:checked");
        if (Instances.length > 0) {
            //console.log($(Instances[0]).attr("extend"));
            return Instances[0];
        }
        else {
            layer.msg('没有选择数据');
        }
    };
     
    //获取选中的值
    HandleCheckbox.prototype.GetValues = function() {
     
        var result = new Array();
        $("[class='" + this.className + "']:checkbox").each(function() {
            if ($(this).is(":checked")) {
                result.push($(this).attr("value"));
            }
        });
        console.log(result);
        return result.join(",");
    };
     
    //检查是否选中数据
    HandleCheckbox.prototype.GetSingleValue = function() {
     
        var args = this.GetValues().split(",");
        if (args == "" || args.length == 0) {
            layer.msg('没有选择数据');
            return false;
        }
     
        if (args.length > 1) {
            layer.msg('请选择一条数据进行操作');
            return false;
        }
        return args[0];
    };
     
    (function() {
     
        handleCheckbox = new HandleCheckbox("zz");
     
    })();
     
    ---------调用示例---------
    <a href="#" onclick="handleCheckbox.Select();">全选</a>
  • 相关阅读:
    正则表达式详解
    js前端性能优化之函数节流和函数防抖
    Vue 给axios做个靠谱的封装(报错,鉴权,跳转,拦截,提示)
    你所误解的微信公众号开发、以及微信公众号网页授权、接收url跳转参数等问题
    JavaScript 复杂判断的更优雅写法
    秒懂 this(带你撸平this)
    Vue.js 3.0 新特性预览
    完美平滑实现一个“回到顶部”
    从插入排序到希尔排序
    LWIP协议中tcp_seg结构相关指针的个人理解
  • 原文地址:https://www.cnblogs.com/tdalcn/p/5937555.html
Copyright © 2011-2022 走看看