javascript - 使用 jqtree 和 jquery ui 选项卡

Question

我正在尝试使用编辑器和其他东西创建文档管理。

我得到以下代码:

<script src="js/ide/lib/codemirror.js"></script>
<link rel="stylesheet" href="js/ide/lib/codemirror.css">
<!-- Tree -->
<div class="masterAdmin">
    <div class="masterAdminNavigation float_left" id="tree">
        <div id="ideFS" data-url="{link modul="ide" operation="home" action="tree"}"></div>
    </div>
    <div class="masterAdminContent float_left">
        <div id="tabs">
            <ul></ul>
        </div>
    </div>
</div>
<script>
{literal}
    $(function(){
        var tabCounter = 0;
        tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close' role='presentation'>Remove Tab</span></li>",
        $('#ideFS').tree({
            saveState: 'ideFStree',
        });
        var tabs = $( "#tabs" ).tabs();
        $('#ideFS').bind(
            'tree.click',
            function(event){
                var node = event.node;
                //node type: node.class
                var li = $( tabTemplate.replace( /#\{href\}/g, "{/literal}{link modul="ide" operation="editor" action="edit"}{literal}?fileid="+node.id ).replace( /#\{label\}/g, node.name ) );
                tabs.find( ".ui-tabs-nav" ).append( li );
                tabs.tabs( "refresh" );
            }
        );
        tabs.delegate( "span.ui-icon-close", "click", function() {
          var panelId = $( this ).closest( "li" ).remove().attr( "aria-controls" );
          $( "#" + panelId ).remove();
          tabs.tabs( "refresh" );
        });
    });
{/literal}
</script>

到目前为止它有效。它会打开一个新选项卡并将代码加载到编辑器中。唯一的问题是，默认情况下这些选项卡不会打开。您必须单击第一个选项卡才能将其打开。我真的不明白这个问题，因为它加载没有任何问题。????

Answer 1

这里的问题是 header 中的基本路径。我删除了它，所有问题都解决了^^