MooTools использует grab/inject для добавления дочерних элементов

Как добавить новый элемент в другой? Код ниже использует примеры на сайте библиотеки, но ничего не отображается. Я проверил содержащий элемент с помощью.innerHTML, который делает рендеринг. Что я делаю неправильно?

var Article = new Class({
  initialize: function(order, title, body){
    this.order = order;
    this.title = title;
    this.body = body;
  }
});

window.addEvent("domready", function() {

  var Content = new Hash();

  Content.set("dbitem15", new Article(1, "title1", "content1"));
  Content.set("dbitem33", new Article(2, "title2", "content2"));

  Hash.each(Content, function(value, key){

    var article_title = new Element("div", {id: "title" + key});
    article_title.set("class", "article_title");
    article_title.innerHTML = value.title;

    var article_content = new Element("div", {id: "content" + key});
    article_content.set("class", "article_content");
    article_content.innerHTML = value.body;

    var article = new Element("div", {id: key});
    article.set("class", "article");

    article.inject(article_title, "after");
    article.inject(article_content, "after");
    //article.grab(article_title, "after");
    //article.grab(article_content, "after");
    //article.innerHTML = key;

    $("plan").grab(article,"after");
  });

});

2 ответа

Решение

Вот некоторый (переработанный) код, который работает: http://jsfiddle.net/mqchen/kJqLf/1/

Основное отличие заключается в следующем:

article.grab(article_title, "bottom");
article.grab(article_content, "bottom");

Проблема заключалась в том, что вы использовали inject(..., after) это означает, что вы добавили созданные элементы (заголовок, содержимое) после элемента article, а это означает, что при последующем помещении элемента article в элемент "plan" элементы title и content не были добавлены (они находятся где-то в пустом месте). вакуум космоса). Вам нужно поместить элементы title и content в элемент article, используя grab(..., bottom),

Предполагая, что я не читаю код неправильно, вы пытаетесь вставить article_title а также article_content в article, да?:

article.inject(article_title, "after");
article.inject(article_content, "after");

В этом случае вы переключили элементы вокруг. .inject() ссылается на элемент, который нужно вставить, и первый параметр предназначен для элемента контейнера.

Так что постарайтесь:

article_title.inject(article, "after");
article_content.inject(article, "after");
Другие вопросы по тегам