if (localStorage.getItem('todo')!=undefined){ var tasks = []; tasks = JSON.parse(localStorage.getItem('todo')); for (var key in tasks) { $('#list').append("
function SaveTask(){ var tasks = []; $('li.task').each(function(i, el){ var val = $(el).text(); tasks.push(val); }); console.log(tasks); localStorage.setItem('todo', JSON.stringify(tasks));
}
function AddTask(){ var val = $('#new-todo').val(); var del = $('').text('×'); var li = $('').html(val).append(del); if (val) { li.appendTo($('#list')); $('#new-todo').val(''); }
del.click(function () { li.remove(); }); }
$('#btn-enter').click(function () { AddTask(); SaveTask(); });
При перезагрузке страницы отображаются только последнедобавленные, вместо всех. Если var tasks = []; сделать глобальной, идет некорректное сохранение в массив. Тут 2 варианта - скорректировать SaveTask() или localStorage. Рассмотрю все... http://jsfiddle.net/Nata_Hamster/6vhas75k/
Ответ
Вы при сохранении делаете выборку по li.task в то время, как класс task добавляете только новым записям, поэтому старые записи не входят в выборку для сохранения.
Не меняя оформление страницы можно сделать выборку #list > li - в нее входят и старые и новые записи.
Такой селектор css читается как "выбрать все элементы li - прямые потомки элемента с id list"
http://jsfiddle.net/6vhas75k/2/
Комментариев нет:
Отправить комментарий