Как создать коллекцию элементов jQuery и добавить их в DOM?

Я перебираю список и мне нужно создать радиокнопку jQuery Mobile для каждого элемента списка. Все переключатели должны быть внутри div class="radio-controls" которые после завершения добавляются в DOM.

Вот что я пытаюсь:

    var label = $("<label/>").attr("data-" + $.mobile.ns + "iconpos", "notext");
      barrel = [];

    for (var i = 0; i < myListitems.length; i += 1) {
      var item = myListitems[i];

      barrel.push(
          $("<input type='radio' name='radio-" + this.uuid + "' value='radio-" + this.uuid + "-" + i +"' />" )
            .wrap(label)
            .checkboxradio()
        );
      }
    }

После цикла у меня есть массив jQuery, который мне нужно добавить.

Но makeArray терпит неудачу и возвращает

context is undefined

внутри jQuery

 if ( ( context.ownerDocument || context ) !== document ) {

который, как говорят, вызван массивом, не состоящим из элементов, выбранных из документа (мой еще не добавлен в DOM), в то время как document.createFragement не работает, потому что я думаю, что я не могу добавить объекты jQuery к фрагменту. Делая это:

 var fragment = document.createDocumentFragment();

 // in my loop
 bullet = $("<input type='radio' name='radio-" + this.uuid + "' value='radio-" + this.uuid + "-" + i +"' />" )
     .wrap(label)
     .checkboxradio()
 fragment.appendChild( bullet );

 // after loop, add to document 
 fragment[o.bulletsPos === "top" ? prependTo : appendTo](el);

возвращает эту ошибку:

 Value does not implement interface Node.

Вопрос: есть ли способ создать коллекцию элементов jQuery и добавить это в DOM? Конечно, я могу вставлять каждый элемент один за другим, но я хочу создать все это динамически и вставить один раз.

Спасибо за помощь!

1 ответ

Решение

Был в состоянии получить это, чтобы добавить следующий пример кода:

var collection = [];
var elem;

for (var i = 0; i < 10; i+=1) {
    elem = $("<span />").attr("class","foo-"+i).text("hello");
    collection.push(elem);
}
console.log(collection);
// the "context" error
//$(collection).appendTo(document.body);
$(document.body).append(collection);

Демонстрация скрипки: http://jsfiddle.net/558qq/3/

Другие вопросы по тегам