Начать новый нумерованный список с помощью jQuery - PullRequest
3 голосов
/ 22 января 2011
<ul>
    <li>test</li>
    <li>test</li>
    <li>test</li>
    <li>test</li>
    <li>test</li>
    <li>test</li>
    <li>test</li>
</ul>

<script>
$(document).ready(function(){   
    var increment=3;
    var start=8;
    $("ul").children().each(function(i) {
        $(this).prepend('<tag>'+(start+i*increment).toString()+'.</tag>');
    });
});
</script>

Есть ли способ начать новый отсчет для другого списка ul?С кодом выше это то, что я получаю!

<ul>
<li> test
<li> test
<li> test
<ul/>

Вывод

1. test
2. test
3. test

Второй список ульт

<ul>
<li> test
<li> test
<li> test
<ul/>

Выход

4. test
5. test
6. test

Вместо того, чтобы начинать второй тег ul с 1. 2. 3. он продолжает считать, используя первый ul 5. 6. 7.

Так что можно сбросить счет и пометить всеснова для другого тега ul?Если это возможно, как?

Ответы [ 3 ]

2 голосов
/ 22 января 2011
$('ul').each(function() {
    $(this).children().each(function(i) {
        $(this).prepend('<span>' + (i + 1) + '.</span> ');
    });
});

Демонстрация: http://jsfiddle.net/vSyK6/1/

2 голосов
/ 22 января 2011

Использовать упорядоченный список:

HTML

<ol id="num_list">
  <li>How</li>
  <li>Now</li>
  <li>Brown</li>
  <li>Cow</li>
</ol>

CSS

#num_list { list-style-type: decimal; }

РЕДАКТИРОВАТЬ : если вы действительно не можете использовать упорядоченный список, используйте JavaScript, например:

$(function() {
  $('ul').each(function() {
     $(this).children().prepend(function(index, html) {
        return '<span>' + (index+1) + '. </span>';
     });
  });
});

Пример jsFiddle

0 голосов
/ 22 января 2011
var increment = 1;
$('ul').each(function() {
    var ul = $(this),
        li = ul.find('> li'),
        ol = $('<ol />').attr('start', increment);
    ul.after(ol);
    ol.append(li);
    ul.remove();
    increment += li.length;
});

Пример: http://jsbin.com/opuyi/3

Это будет с вложенными списками, поскольку они (вероятно) будут выглядеть примерно так:

1. One
2. Two
    4. Three
3. Four
...