Jquery:即使只选择了一个子节点,也会在textarea中显示父节点

时间:2013-02-28 08:07:10

标签: jquery select checkbox parent-child

我有复选框列表,如果选择了子项,则自动选择父项,然后所有选项都显示在textarea中。

问题:

如果只选择了一个子项,则不会在textarea中显示Parent。选择多于1个孩子时显示。即使只选择了一个孩子,我也需要在textarea上显示父母

代码:http://jsfiddle.net/NVhnw/

HTML:

            <ul class="taglist">
            <li class="category">Category:
                <ul>                
                    <li class="category"><input type="checkbox" name="A" value="Parent">Parent
                           <ul>     
                                <li><input type="checkbox" class="liChild" name="A" value="Child1">Child1</li>      
                                <li><input type="checkbox" class="liChild" name="A" value="Child2">Child2</li>      
                            </ul>
                    </li>   
                </ul>   
            </ul>          
            <br/>
            You checked:
            <br/>
            <textarea rows="4" cols="50" class="textfield"  name="describe" class="required" id="describe">
            </textarea> 

Jquery的:

                //* Parent select if children selected*//

                $(document).ready(function() {
                $('input.liChild').change(function() {
                    $(this).closest('ul')
                           .siblings('input:checkbox')
                           .prop('checked', $(this).closest('ul')
                                                   .children()
                                                   .children('input:checkbox')
                                                   .is(':checked'))
                           .first().change();
                });


                $('li.category').addClass('plusimageapply');
                $('li.category').children().addClass('selectedimage');
                $('li.category').children().hide();
                $('li.category').each(
                function(column) {
                $(this).click(function(event){
                if (this == event.target) {
                if($(this).is('.plusimageapply')) {
                $(this).children().show();
                $(this).removeClass('plusimageapply');
                $(this).addClass('minusimageapply');
                }
                else
                {
                $(this).children().hide();
                $(this).removeClass('minusimageapply');
                $(this).addClass('plusimageapply');
                }
                }
                });
                }
                );
                });

                //*Text area update*//
                function updateTextArea() {     
                   var allVals = [];
                   $('.taglist :checked').each(function(i) {

                       allVals.push((i!=0?"\r\n":"")+ $(this).val());
                   });
                   $('#describe').val(allVals).attr('rows',allVals.length) ;

                   }
                   $(function() {
                      $('.taglist input').click(updateTextArea);
                      updateTextArea();
                });

1 个答案:

答案 0 :(得分:0)

改变这个:

$('input.liChild').change(function() {

$('input.liChild').click(function() {

这对我的小提琴起了作用