jQuery：JSTree 和 jQuery UI 选项卡：jsTree 导致选项卡中的其他树被隐藏，CSS 问题？

Question

我已经在网上搜索了解决方案，但似乎找不到。这是我当前的实现：

<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。我似乎无法让其他人出现。

有什么建议吗？

Answer 1

我没有屏蔽内联 HTML，而是屏蔽了 div：

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

有效。