如何从jquery复选框树中获取所选节点项

时间:2012-02-23 16:32:59

标签: javascript-events

我使用jQuery生成复选框树,我无法从树列表中获取已检查的节点。请帮帮我。

这是我的代码: -

<script type="text/javascript">
    //<!--
    $(document).ready(function() {
        $('#tabs').tabs({
            cookie: { expires: 30 }
        });
        $('.jquery').each(function() {
            eval($(this).html());
        });
        $('.button').button();
    });
    //-->
</script>

jQuery checkboxTree插件演示

项目主页

<code class="jquery" lang="text/javascript">
    $('#tree1').checkboxTree({
    initializeUnchecked: 'collapsed',
    collapse: function(){
            alert('collapse event triggered (passed as option)');
    },
    expand: function(){
            alert('expand event triggered (passed as option)');
    },
    check: function(n){
           alert('Hi there!!!'+n);
    },
    uncheck: function(n){
            alert('Hi there!!!'+n);
    }
    });
</code>
<ul id="tree1">
    <li><input type="checkbox"><label>Node 1</label>
        <ul>
            <li><input type="checkbox"><label>Node 1.1</label>
                <ul>
                    <li><input type="checkbox"><label>Node 1.1.1</label>
                </ul>
        </ul>
        <ul>
            <li><input type="checkbox"><label>Node 1.2</label>
                <ul>
                    <li><input type="checkbox"><label>Node 1.2.1</label>
                    <li><input type="checkbox"><label>Node 1.2.2</label>
                    <li><input type="checkbox"><label>Node 1.2.3</label>
                        <ul>
                            <li><input type="checkbox"><label>Node 1.2.3.1</label>
                            <li><input type="checkbox"><label>Node 1.2.3.2</label>
                        </ul>
                    <li><input type="checkbox"><label>Node 1.2.4</label>
                    <li><input type="checkbox"><label>Node 1.2.5</label>
                    <li><input type="checkbox"><label>Node 1.2.6</label>
                </ul>
        </ul>
    <li><input type="checkbox"><label>Node 2</label>
        <ul>
            <li><input type="checkbox"><label>Node 2.1</label>
                <ul>
                    <li><input type="checkbox"><label>Node 2.1.1</label>
                </ul>
            <li><input type="checkbox"><label>Node 2.2</label>
                <ul>
                    <li><input type="checkbox"><label>Node 2.2.1</label>
                    <li><input type="checkbox"><label>Node 2.2.2</label>
                    <li><input type="checkbox"><label>Node 2.2.3</label>
                        <ul>
                            <li><input type="checkbox"><label>Node 2.2.3.1</label>
                            <li><input type="checkbox"><label>Node 2.2.3.2</label>
                        </ul>
                    <li><input type="checkbox"><label>Node 2.2.4</label>
                    <li><input type="checkbox"><label>Node 2.2.5</label>
                    <li><input type="checkbox"><label>Node 2.2.6</label>
                </ul>
        </ul>
</ul>

请帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

您应该只能使用:checked选择器。以下内容应返回tree1元素中任何选中的复选框。

var checkedCheckboxes = $('#tree1 input[type="checkbox"]:checked');