Блог

Главная - Вопросы по программированию - Jquery: динамическое добавление в зависимости от количества

Jquery: динамическое добавление в зависимости от количества

#jquery #slider #javascript-framework

#jquery #слайдер #javascript-фреймворк

Вопрос:

Мой вопрос в том, как добавить список в зависимости от количества div. Результат будет использоваться для подкачки / навигации по скользящему баннеру

 <div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>

Результат должен быть примерно таким

 <ul id="pagging">
  <li><a href="#">nav1</li>
  <li><a href="#">nav2</li>
  <li><a href="#">nav3</li>
</ul>

Но для нас мы хотим, чтобы это было сделано в jquery. Наш jquery сначала подсчитает количество divs, а затем динамически добавит LIS в зависимости от количества divs

Ответ №1:

 var divCount = $("div.panel").length;

for(var i=0;i<divCount;i  ){
   $("ul#pagging").append($("<li/>").text("nav" (i 1)));
}

Кроме того, для подкачки страниц используется только один g.

http://jsfiddle.net/R8mxg/

Ответ №2:

http://jsfiddle.net/yhufH/

Добавление / удаление div для тестирования

Ответ №3:

с помощью jQuery.each

 $("div.panel").each(function(idx){
      $("#pagging").append($("<li/>").text("nav" (idx 1)));
})

примечание: внутренний код, основанный на kingjiv’s