предметы, не входящие в <ul></ul> - PullRequest
Новая
       4

предметы, не входящие в <ul></ul>

1 голос
/ 31 марта 2012

  1. Я создаю меню с объектом javascript и jquery.У меня есть определенные предметы, которые должны быть в <ul></ul>, но вместо этого они под ним.

    http://jsfiddle.net/MWBt6/

  2. У меня есть, например, «Индекс».Там я хочу добавить список элементов.

    Я знаю, что идентификатор категории равен 0, а идентификатор элемента равен 2, я сохранил эти вещи в атрибуте данных.

Теперь, как я могу добавить ul к этому?

Ответы [ 2 ]

1 голос
/ 31 марта 2012

Это не так, как append работает.Вам нужно создавать элементы самостоятельно.Здесь: 

var loadPath = "resources/books/book1/";

var menu = {
    data: [{
        name: "the book",
        id: 0,
        items: [{
            name: "Introduction",
            id: 0,
            target: "inleiding.html"
        }, {
            name: "Content",
            id: 1
        }, {
            name: "Index",
            id: 2
        }]
    }, {
        name: "my stuff",
        id: 1,
        items: [{
            name: "Notes",
            id: 0
        }, {
            name: "Marks",
            id: 1
        }]
    }, {
        name: "other",
        id: 2,
        items: [{
            name: "Search",
            id: 0
        }, {
            name: "Continue Reading",
            id: 1
        }]
    }]
}

$(document).ready(function() {
    var $menu = $('#menu');

    for(var i = 0; i < menu.data.length; i++) {
        var categorie = menu.data[i];
        var categorieName = categorie.name;
        var categorieId = categorie.id;
        var items = categorie.items;

        console.log("categorieName: " + categorieName);

        var list = $('<ul>');

        for(var j = 0; j < items.length; j++) {
            var itemId = items[j].id;
            list.append($('<li>').attr('data-itemId', itemId).text(items[j].name));
        }

        $menu.append(
            $('<li>').attr('data-categorieId', categorieId).append(categorieName, list)
        );
    }
});​

Вот обновленный jsFiddle.

0 голосов
/ 31 марта 2012

Вы пытаетесь добавить, как если бы DOM был текстовым редактором.Вы не можете добавить начало элемента с его открывающим тегом, а затем закрыть этот элемент с добавлением закрывающего тега.Только полные допустимые элементы могут быть вставлены в DOM.

Вместо этого создайте строку html, а затем добавьте только одно добавление после ее завершения.Этот метод гораздо эффективнее, чем многократное добавление.

Рабочая демонстрация: http://jsfiddle.net/MWBt6/3/

...