jQuery操作JSF中的Checkbox树

jQuery操作JSF中的Checkbox树
下面的代码是，当选中父节点，则子节点全选；选中任意一个子节点，则选中父节点


jQuery.noConflict();//与JSF搭配需要这句话，不然会有冲突
        jQuery(document).ready(function() {
        // Add click event listener to each checkbox in the tree page
        // Note! Using this simple selector assumes that there are no other
        // checkboxes on the page, if there are other checkboxes then
        // selector should be changed   
            jQuery(":checkbox").click(function(){
                updateChildren(this);
                updateParent(this);
             });
        });
        </script>
        <script type="text/javascript">
        function updateChildren(currentCheckBox)
        {
            // Get state of current checkbox (true or false)
            var state = currentCheckBox.checked;
           
            // Get parent TABLE, where current checkbox is places
            var parentTables = jQuery(currentCheckBox).parents("table");
            var parentTable = parentTables[0];   
       
            // Get DIV where child nodes with checkboxes are situated
            // See http://docs.jquery.com/Traversing/ to get better uderstanding of
            // parents() and next()       
            var childDivs = jQuery(parentTable).next("div");   
            if(    childDivs.length > 0 )
            {
                var childDiv = childDivs[0];       
           
                // Iterate over all child nodes checkboxes and set same state as the
                // current checkbox state
                jQuery(childDiv).contents().find(":checkbox").each(function() {
                    this.checked = state;
                });
            }

        }
       
        //更新父节点的方法，如果子节点全部选中则父节点选中，如果子节点中有一个选中，则父节点也选中
        function updateParent(currentCheckbox) {
            var parentDivs = jQuery(currentCheckbox).parents("div");
            var parentDiv = parentDivs[0];   

            var hasSelected = false;
           
            jQuery(parentDiv).contents().find(":checkbox").each(function() {
                if(this.checked) {
                    hasSelected = true;
                }
            });
           
            var parentTables = jQuery(parentDiv).prev("table");
            if(parentTables.length > 0)
            {
                var parentTable = parentTables[0];
           
                var parentCheckboxes = jQuery(parentTable).find(":checkbox");
                var parentCheckbox = parentCheckboxes[0];
               
                parentCheckbox.checked = hasSelected ;
            }

        }
下面的代码是，当选中父节点，则子节点全选；选中所有子节点，则选中父节点
jQuery.noConflict();//与JSF搭配需要这句话，不然会有冲突
        jQuery(document).ready(function() {
        // Add click event listener to each checkbox in the tree page
        // Note! Using this simple selector assumes that there are no other
        // checkboxes on the page, if there are other checkboxes then
        // selector should be changed   
            jQuery(":checkbox").click(function(){
                updateChildren(this);
                updateParent(this);
             });
        });
        </script>
        <script type="text/javascript">
        function updateChildren(currentCheckBox)
        {
            // Get state of current checkbox (true or false)
            var state = currentCheckBox.checked;
           
            // Get parent TABLE, where current checkbox is places
            var parentTables = jQuery(currentCheckBox).parents("table");
            var parentTable = parentTables[0];   
       
            // Get DIV where child nodes with checkboxes are situated
            // See http://docs.jquery.com/Traversing/ to get better uderstanding of
            // parents() and next()       
            var childDivs = jQuery(parentTable).next("div");   
            if(    childDivs.length > 0 )
            {
                var childDiv = childDivs[0];       
           
                // Iterate over all child nodes checkboxes and set same state as the
                // current checkbox state
                jQuery(childDiv).contents().find(":checkbox").each(function() {
                    this.checked = state;
                });
            }

        }
       
        //更新父节点的方法，如果子节点全部选中则父节点选中，如果子节点中有一个未选中，则父节点也未选中
        function updateParent(currentCheckbox) {
            var parentDivs = jQuery(currentCheckbox).parents("div");
            var parentDiv = parentDivs[0];   

            var hasSelected = true;
           
            jQuery(parentDiv).contents().find(":checkbox").each(function() {
                if(!this.checked) {
                    hasSelected = false;
                }
            });
           
            var parentTables = jQuery(parentDiv).prev("table");
            if(parentTables.length > 0)
            {
                var parentTable = parentTables[0];
           
                var parentCheckboxes = jQuery(parentTable).find(":checkbox");
                var parentCheckbox = parentCheckboxes[0];
               
                parentCheckbox.checked = hasSelected ;
            }

        }


声明：此文章从 http://www.blogjava.net/TiGERTiAN/archive/2009/12/27/307463.html
转载过来的

评论

2 楼 gw861125 2010-08-05  

好东西

1 楼 gw861125 2010-08-05  

ffff