小编Bla*_*aya的帖子

使用json和jquery帮助处理多级菜单

我正在尝试执行多级菜单,单击">"时会滑动.第一个问题是CSS没有正常工作,<ul>没有浮动到左边.

我需要的只显示一个ul,如果单击">"显示"子"菜单滑动或显示它,任何方法都很有用.

准备好测试的完整代码就在这里

我正在尝试这样做:菜单

JavaScript的

$(document).ready(function(){
    var json = [{"id":"1","parent":"0","slug":"digitalart","name":"Digital Art"},{"id":"2","parent":"1","slug":"3d","name":"3-Dimensional Art"},{"id":"39","parent":"1","slug":"drawings","name":"Drawings"},{"id":"3","parent":"2","slug":"abstract","name":"Abstract"},{"id":"4","parent":"2","slug":"characters","name":"Characters"},{"id":"12","parent":"2","slug":"objects","name":"Objects"},{"id":"23","parent":"2","slug":"scenes","name":"Scenes"},{"id":"32","parent":"2","slug":"unsorted","name":"Unsorted"},{"id":"33","parent":"2","slug":"vehicles","name":"Vehicles"},{"id":"5","parent":"4","slug":"creatures","name":"Animals & Creatures"},{"id":"6","parent":"4","slug":"cartoon","name":"Cartoon"},{"id":"7","parent":"4","slug":"female","name":"Female"},{"id":"8","parent":"4","slug":"groups","name":"Groups"},{"id":"9","parent":"4","slug":"machines","name":"Machines & Robots"},{"id":"10","parent":"4","slug":"male","name":"Male"},{"id":"11","parent":"4","slug":"misc","name":"Miscellaneus"}];
    build_menu(json, 0);
});

function build_menu(json, parent){
    var menu;
    var item = "";
    var counter = 0;
    if(parent != '0'){
        item += '<li><a class="more" onClick="show(); return false;" href="#">Back</a></li>';
    }
    $.each(json, function(i, category) {
        if(category.parent == parent){
            var more = '<a class="more" onClick="show('+parent+'); return false;" href="#">></a>';

            item = item + '<li>' + category.name + more + '</li>';
            build_menu(json, category.id);
            counter++;
        }
    });

    if(counter > …
Run Code Online (Sandbox Code Playgroud)

css jquery json menu multi-level

12
推荐指数
1
解决办法
3033
查看次数

标签 统计

css ×1

jquery ×1

json ×1

menu ×1

multi-level ×1