jquery - 動的に数を増やします (要素を数えます)

Question

要素のリストに数値を入れようとしています-動的に増加する数値-のように:

1. text
2. text
3. ...
...

これまでのところ、私はこれを持っています：

var c = {
    current: 0,
    count: function () {
        this.current++
    }
}
$('.box').each(function (index) {
    $(".number").text(c.current + 1);
    c.count();
});

• jsfiddleを参照してください。しかし、何が欠けていますか？各要素に独自の番号を付けるにはどうすればよいですか?

ありがとう。

Answer 1

http://jsfiddle.net/Qzk3P/4/、コンテキスト パラメーターを追加するのを忘れました。以下の例を参照してください。

$(".number", this).text(c.current + 1);

知らせthis

編集: css-property カウンターを使用して別の例を追加しました。

Answer 2

You are changing the text of ".number", which happens to exist 4 times. Update your code like that:

$('.box').each(function (index) {
    $(".number", this).text(c.current + 1);
    c.count();
});

The this is the context. So you are only looking for the ".number" element inside the currently iterating ".box"

Answer 3

また、あなたは少しやりすぎているようです。

必要な操作はこれだけです。

var count = 0;
$('.box').each(function (index) {
    count ++;
    $(".number", this).text(count);
});

http://jsfiddle.net/Qzk3P/5/

Answer 4

var c = {
    current: 0,
    count: function () {
        this.current++
    }
}
$('.box').each(function (index,v) {
    $(v).children(".number").text(++c.current);
    //c.count();
});