jQuery:JSTree和jQuery UI选项卡:jsTree导致选项卡中的其他树被隐藏,CSS问题?

时间:2010-09-27 15:54:32

标签: javascript jquery jstree

我已经搜索了'网络寻求解决方案,但我似乎无法找到一个。这是我目前的实施:

<div id="NavSlider">
            <div id="NavSliderMenu">
                <div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
                <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" >
                        <li class="ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1">Main Menu</a></li>
                        <li class="ui-corner-top ui-state-default"><a href="#tabs-2">My Menu</a></li>
                        <li class="ui-corner-top ui-state-default"><a href="#tabs-3">Recently Used</a></li>
                    </ul>
                    <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom" >
                        <div id="jsMasterTree" />
                    </div>
                    <div id="tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ">
                        <div id="jsMyTree" />
                    </div>          
                    <div id="tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ">
                        <div id="jsRecentTree" />
                    </div>

                </div>
            </div>
            <a href="#" id="NavSliderA" title="Expand Menu"><span id="NavSliderArrow">
                &nbsp;</span></a>
        </div>

Javascript是:

 $(document).ready(function () {
            $("#jsRecentTree").jstree({
                "json_data": {
                    "ajax": {
                        "url": '<%= ResolveUrl("~/AJAXHandler.aspx?action=Get") %>',
                        "async": true,
                        "cache": true
                    },
                    progressive_render: true
                },
                "plugins": ["themes", "json_data", "cookies", "crrm", "ui"]
            })
            .bind("select_node.jstree", function (NODE, REF_NODE) {
                var nodeToOpen = $.jstree._focused().get_selected();
                if (REF_NODE.rslt.obj[0].className === "jstree-closed") {
                    $.jstree._focused().open_node(nodeToOpen);
                } else if (REF_NODE.rslt.obj[0].className === "jstree-open") {
                    $.jstree._focused().close_node(nodeToOpen);
                } else {
                    window.location = REF_NODE.rslt.obj[0].link.replace("~/", "");
                };
            })

我有另外两个document.ready调用其他树,这些树相同,但数据有点不同。出于某种原因,似乎第一个面板中的jstree吞噬了其他人的CSS。我似乎无法让其他人出现。

有什么建议吗?

1 个答案:

答案 0 :(得分:0)

我没有内联HTML,而是阻止了div:

<div id="jsMasterTree" ></div>

的工作。