Повторение HTML-разметки с jQuery - PullRequest
0 голосов
/ 01 февраля 2012

Выпуск: Я создаю плагин для пагинации проекта.

Вопрос: Как лучше всего повторить тот же HTML-объект в jQuery?

Пример: Я настроил это с

function pagination(pageNumber){
    this.pageNumber = pageNumber;
    for ($i = 1; $i <= pageNumber; $i ++) {
    **$('#myObject').addClass('dot');**
}}

Я хочу иметь возможность использовать my для счетчика для итерации объекта в **, я предполагаю, что это включает в себя действие .appendTo, но я не знаю, как связать свою переменную для управления количеством.

Любые рекомендации?

Ответы [ 3 ]

0 голосов
/ 01 февраля 2012

Вам нужно знать, как повторить объект?Используйте метод .clone () http://api.jquery.com/clone/

for ($i = 1; $i <= pageNumber; $i ++) {
  $('.myObject').clone().addClass('dot').appendTo('.someContainer');
}

Не забудьте не дублировать идентификаторы элементов.

0 голосов
/ 01 февраля 2012

это будет звучать странно, но сделайте HTML-объекты, прежде чем добавлять их !!Огромное увеличение производительности

    var divTemplateHtml = "<div id='helloWorld' class='dot'></div>";
    var divTemplate = $(divTemplateHtml);


    function pagination(pageNumber){
    // do not add elements to an attached DOM in a for loop.
        var container = $("#container-selector").detach();
// now it's detached
        for ($i = 1; $i <= pageNumber; $i ++) {
//trust me, clone it ;)  it saves headaches on other templates
            var clone = divTemplate.clone();
//i like to use this to set IDs
            clone.attr("id", clone.attr("id") +i );
//sounds weird, but attach the fresh clone to the 'detached' container
            container.append(clone);
        }
//put the container back in the DOM
        container.appendTo("#your-final-target");
    }
0 голосов
/ 01 февраля 2012

Попробуйте это в своем цикле.

var newObject = $('#yourObject').clone()
newObject.appendTo('#targetContainer')

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

...