0

我有下面的javascript代码,它动态添加带有复选框的DIV。

var mainDiv = document.createElement('div');
mainDiv.className = 'field';

var innerDiv = document.createElement('div');
innerDiv.className = 'SelectAllCheckBox';

var newlabel = document.createElement("Label");
newlabel.innerHTML = "Select All";

var selectCheckbox = document.createElement('input');
selectCheckbox.type = "checkbox";
selectCheckbox.name = "selectCheckbox";
selectCheckbox.id = "selectCheckboxID";
selectCheckbox.checked = true;

innerDiv.appendChild(selectCheckbox);
innerDiv.appendChild(newlabel);

mainDiv.appendChild(innerDiv);

var BusinessUnitsContainerID = document.getElementById('BusinessUnitsContainer');
BusinessUnitsContainerID.parentNode.insertBefore(mainDiv,BusinessUnitsContainerID);
//$j('.Publications input[type=checkbox]').removeAttr('checked');
$evt.addEventHandler(selectCheckbox, "click", this.getDelegate(this._onSelectAllCheckBoxClick));

function _onSelectAllCheckBoxClick()
{
    //(.Publications input[type=checkbox]) these are multiple checkboxes which are also created dynamically
    var checkboxes = document.querySelectorAll('.Publications input[type=checkbox]');   

    for (var i =0; i < checkboxes.length; i++) 
    {
        checkboxes[i].checked = $j("#selectCheckboxID").checked;
        $j(checkboxes[i]).click(); //calling the click for the child checkboxes as they have there click event and I can't change that as it is application generated click event for them.
    }    
};

不知道为什么我的全选复选框表现不同,现在第一次单击它并没有取消选中所有子复选框,但是第二次单击它工作正常。

知道可能是什么原因吗?

编辑:

//alert("Inside Select All");
    var checkboxes = document.querySelectorAll('.Publications input[type=checkbox]');   

    //alert($("#selectCheckboxID").checked);
    if($("#selectCheckboxID").checked)
    {
        for (var i =0; i < checkboxes.length; i++) 
        {
            checkboxes[i].checked = true;           
            $j("#lblSelectAll").text("Check All");
            $j(checkboxes[i]).click();
        }
    }
    else
    {
        for (var i =0; i < checkboxes.length; i++) 
        {
            checkboxes[i].checked = false;
            $j("#lblSelectAll").text('Uncheck All');  
            $j(checkboxes[i]).click();
        }
    }

上面我写的代码来测试,如何使它简短

4

1 回答 1

0

Replace your _onSelectAllCheckBoxClick function with below and try

function _onSelectAllCheckBoxClick()
{
    $('.Publications input[type=checkbox]').click(); // jQuery default selector format
    // if above doesn't work use your format, comment above code and uncomment below code
    // $j('.Publications input[type=checkbox]').click();
    return true;
}
于 2013-07-14T08:22:41.760 回答