Как непрерывно добавлять переменную на итерацию цикла for, с помощью jQuery?

Question

Я пытаюсь увеличить число на каждой итерации цикла for в jQuery (1.4.2) на ширину предыдущего элемента.

Я пробовал следующее:

var
$lis = $('#bookmarks > li'),
liHeight = parseInt($lis.height()),
numLis = $lis.length;
console.log(numLis);

var totalLeft = '0';
console.log(totalLeft);

for (i=1; i<numLis; i++) {
    var leftOffset = $lis.eq(i-1).width();
    var leftTotal = leftOffset + leftTotal;


    console.log(leftOffset +"/"+ leftTotal);
}

Вывод из этого раздела:

11 (the length of the array)
0 (the initial value of 'totalLeft')
97/97
117/214
90/
115/NaN
101/NaN
138/NaN
93/NaN
96/NaN
102/NaN
80/NaN

Я пытался использовать parseInt() вокруг одной и обеих переменных в присваивании переменной var leftTotal = leftOffset + leftTotal;, но безрезультатно. Я также пытался использовать jQuery each(), с тем же результатом. Что неудивительно, поскольку я присваивал значения почти одинаково ...

Здесь есть два вопроса:

1. Почему leftTotal не число (NaN)?
2. Как добавить новое значение leftOffset к значению предыдущей итерации leftOffset?

Журнал консоли должен читать что-то вроде:

11
0
97/97
117/214
90/304
115/419
101/520
138/658
93/751
96/847
102/949
80/1029

<ч /> Отредактировано в ответ на @KennyTM:

Вывод Console.log теперь (более многообещающий):

11
0
97 "/" "970"
117 "/" "117970"
90 "/" "90117970"
115 "/" "11590117970"
101 "/" "10111590117970"
138 "/" "13810111590117970"
93 "/" "9313810111590117970"
96 "/" "969313810111590117970"
102 "/" "102969313810111590117970"
80 "/" "80102969313810111590117970"

Что касается @Tomalak: да, это была опечатка. К сожалению, это была опечатка и в моем коде, и в настоящем чертовом скрипте. ... вздох ... Спасибо за улов, хотя, похоже, это очень помогло.

... как неловко. =)

Answer 1

я бы попробовал что-то вроде этого:

var leftTotal = 0
$('#bookmarks > li').each( function(){ 
    leftTotal += parseInt(this.width());  // just to be sure its an int :) 
    console.log(this.width(); +"/"+ leftTotal);
});

Answer 2

Похоже, что вы не присваиваете totalLeft в своем коде.

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

var totalLeft = 0;

$('#bookmarks > li:gt(0)').prev().each(function () {
    totalLeft += $(this).width();
});

Как минимум, это генерирует тот же номер, что и код в вашем собственном ответе .

Answer 3

Кажется, вы не сохраняете последнее значение для следующей итерации. Т.е. - вывести «var leftTotal» из цикла, чтобы оно сохраняло значение для следующей итерации и вы добавляли к нему.

Надеюсь, я вас правильно понял:)

Answer 4

Решением было, по-видимому, уделить немного больше внимания именам переменных и использовать parseInt:

var
$lis = $('#bookmarks > li'),
liHeight = parseInt($lis.height()),
numLis = $lis.length;
console.log(numLis);

var leftTotal = '0';    // somehow, between creating this var and the loop I started calling it something else 'totalLeft', for no known reason.
console.log(leftTotal);

for (i=1; i<numLis; i++) {
    var leftOffset = $lis.eq(i-1).width();
    var leftTotal = leftOffset + parseInt(leftTotal);   // added the parseInt here to force it to be a number.      

    console.log(leftOffset, "/" , leftTotal);
}

Благодаря @ Tomalak, который поймал мою клиническую слепоту ... =)

Answer 5

var totalLeft = 0;
console.log(totalLeft);

for (i=1; i<numLis; i++) {
    var leftOffset = $lis.eq(i-1).width();
    var leftTotal = parseInt(leftOffset,10) + totalLeft;


    console.log(leftOffset +"/"+ leftTotal);
}