Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/472.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何使用jquery在子菜单下动态添加子菜单?_Javascript_Jquery_Css - Fatal编程技术网

Javascript 如何使用jquery在子菜单下动态添加子菜单?

Javascript 如何使用jquery在子菜单下动态添加子菜单?,javascript,jquery,css,Javascript,Jquery,Css,我需要使用jquery动态创建以下菜单栏结构 -Setting --System ---user ---group ---acl --Vresource ---vms ---vnet-conf --Configuration ---template ---image 在我的例子中,系统的子菜单{user,group,acl}属于设置而不是系统菜单 我已经在我的.js文件中编写了下面的代码 var li_item = '<li id="li_'+tab_name+'" class="'+

我需要使用jquery动态创建以下菜单栏结构

-Setting
--System
---user
---group
---acl
--Vresource
---vms
---vnet-conf
--Configuration
---template
---image
在我的例子中,系统的子菜单{user,group,acl}属于设置而不是系统菜单

我已经在我的.js文件中编写了下面的代码

 var li_item = '<li id="li_'+tab_name+'" class="'+tabClass+' '+parent+'"><a href="#">'+tab_info.title+'<span class="icon-caret-left icon-large plusIcon right"></span></a></li>';

    //if this is a submenu... div#menu ul#navigation li.vresources-tab
    if (parent.length) {
        var children = $('div#menu ul#navigation li.'+parent);

        //if there are other submenus, insert after last of them
        if (children.length){
            $(children[children.length-1]).after(li_item);
        }else{ //instert after parent menu
            $('div#menu ul#navigation li#li_'+parent).after(li_item);
        }
    } else { //not a submenu, instert in the end
        $('div#menu ul#navigation').append(li_item);
    };
var li_item='
  • ; //如果这是一个子菜单。。。div#菜单ul#导航li.vresources-tab if(父项长度){ var children=$('div#menu ul#navigation li.'+parent); //如果还有其他子菜单,请在最后一个子菜单之后插入 if(儿童长度){ $(children[childrence.length-1])。在(li_项)之后; }else{//insert在父菜单之后 $('div#menu ul#navigation li#li#li#'+父项)。在(li#项)之后; } }否则{//不是子菜单,最后插入 $('div#menu ul#navigation')。追加(li#u项); };
    这段代码生成下面的html代码段

    <div class="menu-navZ">
    <ul id="navigation" class="tabs vertical">
    <li id="li_settings-tab" class="topTab tab_with_no_content">
    <li id="li_system-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_vresources-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_configuration-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_templates-tab" class="subTab subsubTab configuration-tab" style="display: none;">
    <li id="li_images-tab" class="subTab subsubTab configuration-tab" style="display: none;">
    <li id="li_vms-tab" class="subTab subsubTab vresources-tab" style="display: none;">
    <li id="li_vnetconf-tab" class="subTab subsubTab topTab vresources-tab" style="display: none;">
    <li id="li_users-tab" class="subTab subsubTab system-tab" style="display: none;">
    <li id="li_groups-tab" class="subTab subsubTab system-tab" style="display: none;">
    <li id="li_acls-tab" class="subTab subsubTab system-tab" style="display: none;">
    </ul>
    </div>
    
    
    
    正如您在这里看到的,
  • 子菜单的语句以不正确的方式生成,它应该位于正确的菜单下,就像最后三个语句用户、组和acl应该位于系统下一样

    预期产出:

    <div class="menu-navZ">
    <ul id="navigation" class="tabs vertical">
    <li id="li_settings-tab" class="topTab tab_with_no_content">
    <li id="li_system-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_users-tab" class="subTab subsubTab system-tab" style="display: none;">
    <li id="li_groups-tab" class="subTab subsubTab system-tab" style="display: none;">
    <li id="li_acls-tab" class="subTab subsubTab system-tab" style="display: none;">
    
    <li id="li_vresources-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_vms-tab" class="subTab subsubTab vresources-tab" style="display: none;">
    <li id="li_vnetconf-tab" class="subTab subsubTab topTab vresources-tab" style="display: 
    
    <li id="li_configuration-tab" class="subTab topTab tab_with_no_content settings-tab" style="display: none;">
    <li id="li_templates-tab" class="subTab subsubTab configuration-tab" style="display: none;">
    <li id="li_images-tab" class="subTab subsubTab configuration-tab" style="display: none;">
    none;">
    </ul>
    </div>
    
    
    

    请帮我解决这个问题

    菜单元素没有正确嵌套的原因是您没有在代码中构建嵌套的
    元素,您只是试图将
  • 元素与其他
  • 元素嵌套。每个子菜单都应该是一个嵌套在先前无序列表中的新无序列表。

    是,您是ri8。。但是这些语句是动态生成的,所以我被卡住了