localStorage не может запомнить переменную

397

01 июня 2017, 09:37

Есть код:

    <script>
            document.querySelector('.fon1').onclick = function() {                  
                var fon = {1};                      
            }
            document.querySelector('.fon2').onclick = function() {                  
                var fon = {2};                      
            }
            document.querySelector('.fon3').onclick = function() {                  
                var fon = {3};                      
            }
            var sObj = JSON.stringify(fon)
            localStorage.setItem("object", sObj)
            localStorage.object
            var retObj = JSON.parse(localStorage.getItem("object"))
        </script>

<a href="#">
                <div class="fon1">
                    <img src="/images/main3.jpg" alt="текст">
                    <for>Текст1</for>   
                    <for1>Текст2</for1> 
                </div>
            </a>    
            <a href="#">
                <div class="fon2">
                    <img src="/images/main3.jpg" alt="текст">
                    <for>Текст1</for>   
                    <for1>Текст2</for1>                     
                </div>
            </a>    
            <a href="#">
                <div class="fon3">
                    <img src="/images/main3.jpg" alt="текст">
                    <for>Текст1</for>   
                    <for1>Текст2</for1>                     
                </div>
            </a>

Так вот почему-то переменная fon не может запомниться. Т.е. когда я вынимаю переменную на другой странице:

localStorage.object

       var retObj = JSON.parse(localStorage.getItem("object"))
if(retObj != "1") { } else if(retObj != "2") { }

Он считает, что это число "1". Хотя я до этого нажал на div класса "fon2" и alert мне выдал, что fon теперь равен "2". В чем может быть проблема? По сути же, переменная изменилась и далее сохранилась в переменную

Answer 1

Ваш код не записывает измененное значение в localStorage.

var fon = 0;                      
function SaveFon() {
  localStorage.setItem("object", fon)
}
document.querySelector('.fon1').onclick = function() {                  
  fon = 1;
  SaveFon();
}
document.querySelector('.fon2').onclick = function() {                  
  fon = 2;
  SaveFon();
}
document.querySelector('.fon3').onclick = function() {                  
  fon = 3;
  SaveFon();
}