纯JS 实现 点击 全选/全不选 checkbox 功能

html

<input id="select_direction" type="button" onclick="select_check();" select_direction="f" value="全选/全不选"/>

js

// js 全选复选框按钮
function select_check()
{
    // 获取所有input 集合
    var obj_input = document.getElementsByTagName('input');
    var obj_input_checked = [];
    var obj_select_check = document.getElementById('select_direction');
    
    // 获取所有id 含有 checked_ 值得集合
    for(var i=0;i < obj_input.length; i++)
    {
        var res = obj_input[i].id.match('checked_');
        if(res != null)
        {
            obj_input_checked.push(obj_input[i]);
        }
    }
    
    // 选中所有复选框
    if(obj_select_check.getAttribute('select_direction') == 'f')
    {
        for(var i=0;i < obj_input_checked.length; i++)
        {
            obj_input_checked[i].checked = true;
        }
        obj_select_check.setAttribute('select_direction','t');
    }
    // 取消所有复选框
    else
    {
        for(var i=0;i < obj_input_checked.length; i++)
        {
            obj_input_checked[i].checked = false;
        }
        obj_select_check.setAttribute('select_direction','f');
    }
}