列复选框，按列选中/取消选中答案

【问题标题】：Column checkboxes, checking/unchecking by columns列复选框，按列选中/取消选中
【发布时间】：2013-06-24 14:38:27
【问题描述】：

<script type="text/javascript">
    function marcarJob(source) 
    {
        checkboxes=document.getElementsByTagName('input');
        for(i=0;i<checkboxes.length;i++)
        {
            if(checkboxes[i].type == "checkbox") 
            {
                checkboxes[i].checked=source.checked;
            }
        }
    }

    function marcarDeproc(source) 
    {
        checkboxes=document.getElementsByTagName('input');
        for(i=0;i<checkboxes.length;i++) //record all controls
        {
            if(checkboxes[i].type == "checkbox") 
            {
                checkboxes[i].checked=source.checked;
            }
        }
    }

    function marcarEs(source) 
    {
        checkboxes=document.getElementsByTagName('input');
        for(i=0;i<checkboxes.length;i++)
        {
            if(checkboxes[i].type == "checkbox") 
            {
                checkboxes[i].checked=source.checked; // (mark/unmark all)
            }
        }
    }
</script>

它的方式是，当我选中一个顶部复选框时，会选中所有复选框。

我需要它们在列中点亮。如果第一个被选中，其他的也必须被选中/取消选中，按列排序，列的第一个复选框类似于“全选”，但仅限于该列。

【问题讨论】：

标签： javascript html checkbox

【解决方案1】：

首先要注意的是，您正在使用 tagName 访问复选框，它会找到页面上的所有复选框。

您需要创建同名的单列复选框，如下所示：

<input type="checkbox" name="column1_checkAll" onclick="javascript: checkUncheckAll('column1', this);"/>
<input type="checkbox" name="column1_checkbox" id="chk1" /> 
to 
<input type="checkbox" name="column1_checkbox" id="chkn" />

并添加以下 javascript 以选中/取消选中单列的所有复选框。

function checkUncheckAll(columnNo, checkboxObject){
    if(checkboxObject){ // Check for null IE
        var checkStatus = checkboxObject.checked; // CheckAll checked or unchecked status
        var columnName = columnNo+'_checkbox';
        var allCheckboxes = document.getElementsByName(columnName);             

        for(var i= 0; i < allCheckbox.length; i++){
            allCheckboxes[i].checked = status;
        }
    }
}

【讨论】：