Итерация в JQuery - PullRequest
Новая
       22

Итерация в JQuery

2 голосов
/ 29 июня 2009

Я новичок в jQuery.

У меня в коде переменная приращения, которая показывает, сколько делений в панели.

Я хочу пройтись по этим элементам div, чтобы получить свойства меток, типа ввода, размера всего внутри каждого элемента div.

Начиная с 1, я хочу итерацию до приращения. Как я могу сделать это в JQUery? Пожалуйста, дайте мне предложение.

Ответы [ 2 ]

4 голосов
/ 29 июня 2009

Если вы хотите перебрать все элементы div на панели в JQuery, то самым простым способом было бы просто сделать следующее: 

$("#panel div").each(function() { 
  // $(this) refers to the div
}

Если вы хотите ограничить это до первых N делений, есть множество способов сделать это: 

$("#panel div:lt(" + (N+1) + ")").each(function() { 
  // limits to the only those div's less than N+1.
}
2 голосов
/ 29 июня 2009

Я согласился бы с тем, что сказал Самджудсон, но с немного большей проработкой.

Во-первых, селектор "#panel div" получает все элементы div внутри элемента с идентификатором "panel", который звучит так, как вы хотите. Затем, используя функцию 'each' в jQuery, вы можете вызвать произвольную функцию, каждый из которых связан с элементом this.

Так что в этой функции "this" фактически является элементом каждого div в DOM. Ссылаясь на $ (this), вы получаете мощь взаимодействия jQuery с элементом - но если вам просто нужны голые свойства самого элемента DOM, вы можете получить их прямо из 'this'. 

$('#panel div').each(function(i) {
    // 'this' is the div, i is an incrementing value starting from 0,
    // per zero-based JS norms
    // If you're going to do a lot of jQuery work with the div,
    // it's better to make the call once and save the results - more efficient
    var $this = $(this);

    // If you want to get out before you're done processing,
    // simply return false and it'll stop the looping, like a break would
    if (i > 4) { return false; }

    // Look up the labels inside of the div
    // Note the second argument to the $ function,
    // it provides a context for the search
    $("label", this).each(function(){
        // 'this' is NOW each label inside of the div, NOT the div
        // but if you created a $this earlier, you can still use it to get the div
        // Alternately, you can also use $(this).parent()
        // to go up from the label to the div
    });
})
...