Question

我想将li附加到孩子ul，但我不知道为什么这不起作用。我有html标签：

<ul class="role_module">
    <ul class="role_permission"></ul>
</ul>

和这个javascript：

if (response) {
    $('ul.role_module').empty();

    $.each(response, function (module, value) {
        $("ul.role_module").append($("<li>").text(module));

        $.each(this, function (permission, value) {
            $("ul.role_permission").append($("<li>").text(permission));
        });

    });
 } else {
    alert('Error');
 }

我的数组看起来像这样：

array(2) {
   account => array(2) {
      account_view => 2
      account_edit => 2
   }
   admin => array(2) {
      admin_business_partner_view => 4
      admin_business_partner_edit => 4
}

我想要这个结果

帐户
- account_view
- account_edit
管理员
- admin_business_partner_view
- admin_business_partner_edit

但不是这样，我没有任何李子就得到这个：

帐户
管理员

我做错了什么？

Answer 1

请参阅以下代码

Jquery的

var obj = {
   'account': ['account_view' , 'account_edit'],
    'admin' : ['admin_business_partner_view' ,
      'admin_business_partner_edit']
}

$.each(obj, function (index, value) {    
    $("ul.role_module").append($("<li class='" + index + "'></li>" ).text(index));
    $("ul.role_module").append($("<ul class='role_permission'>"));
    $.each(value, function (permission, value1) {        
        $("li."  + index + "+ ul.role_permission").append($('<li></li>').text(value1));
    });
});

HTML

<ul class="role_module">    
</ul>

请参阅fiddle

<强>更新

将ul元素包含在另一个ul内并不是一件容易的事。你应该在父child ul内附加li元素。

请参阅updated-fiddle

Answer 2

我想你应该修改你的javascript代码：

if (response) {
    var $roleModule = $(".role_module");
    $roleModule.empty();

    $.each(response, function (module, value) {
        var $roleModuleItem = $("<li />").text(module).append($("<ul class='role_permission' />"));
            $roleModule.append($roleModuleItem);

        $.each(this, function (permission, value) {
            $roleModuleItem.find("ul").append($("<li />").text(permission));
        });

    });
 } else {
    alert('Error');
 }

Working example

附加到孩子ul

2 个答案: