Система очков - localStorage

Question

Я создаю систему баллов, и как только люди наберут достаточно очков, они могут использовать некоторые из баллов для получения интересных функций на моем сайте. Часть использования баллов (отвлекающая баллы каждый раз, когда пользователь получает что-то со своими баллами) кода не работает. Вот мой JQuery для системы очков:

$(document).ready(function(){
   $('#curren').delay(200).animate({'top' : '-1px'},1500);
if (localStorage.points222){
  localStorage.points222=Number(localStorage.points222) +5;
}
else{
  localStorage.points222=0;
}
function buy5(){
  if (localStorage.points222){
  localStorage.points222=Number(localStorage.points222) -5;
}
else{
  localStorage.points222=0;
}
} 
   $('#point_counter').html(localStorage.points222);

if(Number(localStorage.points222) > 1){
   $('#point_name').html("1");
   $('#take').fadeIn();
}
else{
   $('#take').fadeOut();
} 
if(Number(localStorage.points222) > 500){
   $('#point_name').html("2");
}
if(Number(localStorage.points222) > 1000){
   $('#point_name').html("3");
}

if(Number(localStorage.points222) > 2000){
   $('#point_name').html("4");
}
if(Number(localStorage.points222) > 5000){
   $('#point_name').html("5");
}
if(Number(localStorage.points222) > 10000){
   $('#point_name').html("6");
}
if(Number(localStorage.points222) > 20000){
   $('#point_name').html("7");
}
});

и HTML:

<div id="curren">
  Your Current Level: <b><span id="point_name"></span></b><br>
  Points: <b><span id="point_counter"></span></b>
  <span style="FLOAT:right;cursor:pointer;display:none;" id="take" onclick="buy5()">-5</span>
</div>

Если вам нужна дополнительная информация о настройке кода, сообщите мне.

Answer 1

Краткий ответ: вы никогда не обновляете отображаемое количество очков. Вы ошиблись линией.

Значение в localStorage действительно уменьшается на 5 каждый раз, когда пользователь нажимает на <span> и вызывается buy5(), , но .. вы никогда не обновите отображаемое значение точек. Другими словами, линия ..

$('#point_counter').html(localStorage.points222);

.. должно быть в определении buy5, когда сейчас это слишком далеко. Он не вызывается в конце каждого buy5(), он вызывается только один раз, как часть $(document).ready().