Trying to use local storage to track is user has visited page, not working












0















Greetings denizens of StackOverflow. I'm trying to do a simple trick using local storage on my portfolio. When the user visits one of my projects, it sets a variable in local storage so that when the user comes back, the console will say "train timer visited" in the console.



This doesn't work. The first function fires, but upon return it does not say I have visited the respect project in the console. What is going on?



Here are the two most important functions:



$(".thumbnail").click(function()

{

  console.log("function firing: setting " + this.id + " to true");



  localStorage.setItem(this.id, true);

//set visited to true

})


And:



  function showStuff() {

    $("#content").fadeIn("slow");



    var visitedTrain = localStorage.getItem("trainTimer");



    if (visitedTrain == true)

    {

      console.log("train timer visited");

    }

}


Here is the entirety of my code:



<!DOCTYPE html>

<html lang ="en-us">

<head>

  <meta charset="UTF-8">

  <title>Portfolio</title>



  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

  <link rel="stylesheet" type="text/css" href="style.css">



   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

   <style>



  #content {

    display: none;

  }

  .thumbnail:hover {

    border-style: solid;

    border-width: 3px;

    border-color:#E67F18;

  }

</style>



    <meta name="viewport" content="width=device-width, initial-scale=1.0">



   </head>









<body onload="showStuff()">





  <nav class="navbar navbar-default">

  <div class="container-fluid">

    <div class="navbar-header">

      <a class="navbar-brand" href="index.html">Dennis Markham</a>

    </div>

    <ul class="nav navbar-nav">

      <li><a href="index.html">About Me</a></li>

      <li class = "active"><a href="portfolio.html">Portfolio</a></li>

      <li><a href="contact.html">Contact</a></li>

    </ul>

  </div>

</nav>





<!-- <div class ="container">

<section class ="row">

<div class ="col-md-1">

</div>

<div class="col-md-10"> 

<a href = "https://dennismarkham.github.io/trainTime/"> <img class = "portfolio" src = "images/dummy_image.png" alt ="train simulator"><span class = "caption">Train Timer </span></img></a> 

<a href = "https://dennismarkham.github.io/week-4-game/"><img class = "portfolio" src = "images/dummy_image.png" alt ="crystal collector"></img></a>

<a href = "#"><img class = "portfolio" src = "images/dummy_image.png" alt ="coming soon..."></img></a>

</div>

<div class = "col-md-1">

  </div>

</section>

</div> -->

<div id = "content">





<div class = "row">

<div class = "col-md-1">

</div>



<h1 style="padding: 5px; display: inline; border-radius:25px;">Solo Endeavors</h1>

<hr>

<br>

<br>

</div>



<div class="row">

  <div class = "col-md-2"></div>



  <div class="col-md-4"   onmouseover ="crystal()">

    <div class="thumbnail" id = "crystalCollector">

      <a href="https://dennismarkham.github.io/week-4-game/">

        <img style = "height: 250px" src="images/crystal.png" alt="Crystal" style="width:100%"

        data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">

        <div class="caption">

          <p>Crystal Collector</p>

        </div>

      </a>

    </div>

  </div>



<div class="col-md-4"  onmouseover = "train()">

    <div class="thumbnail" id = "trainTimer">

      <a href="https://dennismarkham.github.io/trainTime/">

        <img  style = "height: 250px" src="images/train2.png" alt="Train" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery, Moment.js, JSON, Bootstrap">

        <div class="caption">

          <p>Train Timer</p>

        </div>

      </a>

    </div>

  </div>



  <div class = "col-md-2"></div>

</div>



<div class="row">

  <div class = "col-md-2"></div>



  <div class="col-md-4" onmouseover="boom()">

    <div class="thumbnail" id = "bombDefuser">

      <a href="https://dennismarkham.github.io/BombDefuser/">

        <img style = "height: 250px" src="images/bomb.png" alt="Bomb" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">

        <div class="caption">

          <p>Bomb Defuser</p>

        </div>

      </a>

    </div>

  </div>



  <div class="col-md-4"  onmouseover="thunder()">

    <div class="thumbnail" id = "weatherMonitor">

      <a href="https://dennismarkham.github.io/AustinWeatherV2/">

        <img  style = "height: 250px" src="images/weather.png" alt="weather" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, AJAX, Firebase">

        <div class="caption">

          <p>Austin Weather Monitor</p>

        </div>

      </a>

    </div>

  </div>





  <div class = "col-md-2"></div>

</div>



<div class="row">

  <div class = "col-md-2"></div>



  <div class="col-md-4"  onmouseover="shutter()">

    <div class="thumbnail" id = "reactGallery" >

      <a href="https://rphotogallery.herokuapp.com/">

        <img style = "height: 250px" src="images/camera.png" data-toggle="tool-tip" title = "HTML, CSS, React, Bootstrap" alt="camera" style="width:100%">

        <div class="caption">

          <p>React Photo Gallery</p>

        </div>

      </a>

    </div>

  </div>





  <div class="col-md-4" >

    <div class="thumbnail" id = "roulette">

      <a href="https://dennismarkham.github.io/Roulette/">

        <img  style = "height: 250px" src="images/wheel.png" alt="roulette wheel" style="width:100%" data-toggle="tool-tip" title = "HTML, CSS, Javascript, Javascript Animation, JQuery, Bootstrap">

        <div class="caption">

          <p>Javascript Roulette Wheel <span style = "color:red; font-style:bold;">(WIP)</span></p>

        </div>

      </a>

    </div>

  </div>



</div>



<div class = "row">

<div class = "col-md-1">

</div>

<h1 style="padding: 5px; display: inline; border-radius:25px;">Works in Progress (Solo)</h1>

<hr>

<br>

<br>

</div>



<div class="row">

  <div class = "col-md-2"></div>





   <div class="col-md-4" onmouseover="wiping()">

    <div class="thumbnail" id = "whiteboard" >

      <a href="https://dennismarkham.github.io/Angular_Whiteboard/">

        <img style = "height: 250px" src="images/whiteboard.png" alt="whiteboard" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, Angular.js">

        <div class="caption">

    <p>AngularJS Whiteboard <span style = "color:red; font-style:bold;">(WIP)</span></p>

        </div>

      </a>

    </div>

  </div>









  <div class = "col-md-2"></div>

</div>





<div class = "row">

<div class = "col-md-1">

</div>

<h1 style="padding: 5px; display: inline; border-radius:25px;">Group Work</h1>

<hr>

<br>

<br>

</div>



<div class="row">

  <div class = "col-md-2"></div>





   <div class="col-md-4"  onmouseover = "typing()">

    <div class="thumbnail" id = "chatroom">

      <a href="https://cacheualcorner.herokuapp.com/">

        <img src="images/CC.png" alt="Cache-ual Corner (chat room)" style="width:100%" data-toggle= "tool-tip" title = "HTML, CSS, Javascript, JQuery, SQL, Express, Moment.JS">

        <div class="caption">

          <p>Cache-ual Corner</p>

        </div>

      </a>

    </div>

  </div>



  <div class="col-md-4">

  </div>

  <div class = "col-md-2"></div>

</div>



</div>

<script>



//on click of .thumbnail a local storage variable with the name of this.id is set to true

//first need to set the variables in local storage and make them false...right?





$(".thumbnail").click(function()

{

  console.log("function firing: setting " + this.id + " to true");



  localStorage.setItem(this.id, true);

//set visited to true

})

//QUESTIONS:

//-Train sound and magic sound

var trainSound = new Audio("train.wav");

  trainSound.volume = 0.1;

  var crystalSound = new Audio("crystal.wav");

  crystalSound.volume = 0.25;

   var shutterSound = new Audio("shutter.wav");

   shutterSound.volume = 0.2;

  var thunderSound = new Audio("thunder.wav");

  thunderSound.volume = 0.15;

  var boomSound = new Audio("boom.mp3");

  boomSound.volume = 0.15;

  var typingSound = new Audio("typing.wav");

  typingSound.volume = 0.15;

  var wipingSound = new Audio("wiping.wav");

  wipingSound.volume = 0.5;



  function showStuff() {

    $("#content").fadeIn("slow");



    var visitedTrain = localStorage.getItem("trainTimer");



    if (visitedTrain == true)

    {

      console.log("train timer visited");

    }

}





 function train(){

  trainSound.play();

  console.log("Playing train");

 }

 function crystal(){

  crystalSound.play();

  console.log("Playing crystal");

 }

 function shutter(){

 shutterSound.play();

 console.log("Playing shutter");

 }

 function thunder(){

  thunderSound.play();

  console.log("Playing thunder");

 }

 function boom(){

  boomSound.play();

  console.log("Playing boom");

 }

function typing(){

  typingSound.play();

  console.log("playing typing");

}

function wiping(){

  wipingSound.play();

  console.log("playing wiping");

}

</script>

</body>

</html>





javascript jquery html local-storage persistent







share|improve this question



























    0















    Greetings denizens of StackOverflow. I'm trying to do a simple trick using local storage on my portfolio. When the user visits one of my projects, it sets a variable in local storage so that when the user comes back, the console will say "train timer visited" in the console.



    This doesn't work. The first function fires, but upon return it does not say I have visited the respect project in the console. What is going on?



    Here are the two most important functions:



    $(".thumbnail").click(function()
    
{
    
  console.log("function firing: setting " + this.id + " to true");
    

    
  localStorage.setItem(this.id, true);
    
//set visited to true
    
})


    And:



      function showStuff() {
    
    $("#content").fadeIn("slow");
    

    
    var visitedTrain = localStorage.getItem("trainTimer");
    

    
    if (visitedTrain == true)
    
    {
    
      console.log("train timer visited");
    
    }
    
}


    Here is the entirety of my code:



    <!DOCTYPE html>
    
<html lang ="en-us">
    
<head>
    
  <meta charset="UTF-8">
    
  <title>Portfolio</title>
    

    
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    
  <link rel="stylesheet" type="text/css" href="style.css">
    

    
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    
   <style>
    

    
  #content {
    
    display: none;
    
  }
    
  .thumbnail:hover {
    
    border-style: solid;
    
    border-width: 3px;
    
    border-color:#E67F18;
    
  }
    
</style>
    

    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    

    
   </head>
    

    

    

    

    
<body onload="showStuff()">
    

    

    
  <nav class="navbar navbar-default">
    
  <div class="container-fluid">
    
    <div class="navbar-header">
    
      <a class="navbar-brand" href="index.html">Dennis Markham</a>
    
    </div>
    
    <ul class="nav navbar-nav">
    
      <li><a href="index.html">About Me</a></li>
    
      <li class = "active"><a href="portfolio.html">Portfolio</a></li>
    
      <li><a href="contact.html">Contact</a></li>
    
    </ul>
    
  </div>
    
</nav>
    

    

    
<!-- <div class ="container">
    
<section class ="row">
    
<div class ="col-md-1">
    
</div>
    
<div class="col-md-10"> 
    
<a href = "https://dennismarkham.github.io/trainTime/"> <img class = "portfolio" src = "images/dummy_image.png" alt ="train simulator"><span class = "caption">Train Timer </span></img></a> 
    
<a href = "https://dennismarkham.github.io/week-4-game/"><img class = "portfolio" src = "images/dummy_image.png" alt ="crystal collector"></img></a>
    
<a href = "#"><img class = "portfolio" src = "images/dummy_image.png" alt ="coming soon..."></img></a>
    
</div>
    
<div class = "col-md-1">
    
  </div>
    
</section>
    
</div> -->
    
<div id = "content">
    

    

    
<div class = "row">
    
<div class = "col-md-1">
    
</div>
    

    
<h1 style="padding: 5px; display: inline; border-radius:25px;">Solo Endeavors</h1>
    
<hr>
    
<br>
    
<br>
    
</div>
    

    
<div class="row">
    
  <div class = "col-md-2"></div>
    

    
  <div class="col-md-4"   onmouseover ="crystal()">
    
    <div class="thumbnail" id = "crystalCollector">
    
      <a href="https://dennismarkham.github.io/week-4-game/">
    
        <img style = "height: 250px" src="images/crystal.png" alt="Crystal" style="width:100%"
    
        data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
    
        <div class="caption">
    
          <p>Crystal Collector</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    
<div class="col-md-4"  onmouseover = "train()">
    
    <div class="thumbnail" id = "trainTimer">
    
      <a href="https://dennismarkham.github.io/trainTime/">
    
        <img  style = "height: 250px" src="images/train2.png" alt="Train" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery, Moment.js, JSON, Bootstrap">
    
        <div class="caption">
    
          <p>Train Timer</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    
  <div class = "col-md-2"></div>
    
</div>
    

    
<div class="row">
    
  <div class = "col-md-2"></div>
    

    
  <div class="col-md-4" onmouseover="boom()">
    
    <div class="thumbnail" id = "bombDefuser">
    
      <a href="https://dennismarkham.github.io/BombDefuser/">
    
        <img style = "height: 250px" src="images/bomb.png" alt="Bomb" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
    
        <div class="caption">
    
          <p>Bomb Defuser</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    
  <div class="col-md-4"  onmouseover="thunder()">
    
    <div class="thumbnail" id = "weatherMonitor">
    
      <a href="https://dennismarkham.github.io/AustinWeatherV2/">
    
        <img  style = "height: 250px" src="images/weather.png" alt="weather" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, AJAX, Firebase">
    
        <div class="caption">
    
          <p>Austin Weather Monitor</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    

    
  <div class = "col-md-2"></div>
    
</div>
    

    
<div class="row">
    
  <div class = "col-md-2"></div>
    

    
  <div class="col-md-4"  onmouseover="shutter()">
    
    <div class="thumbnail" id = "reactGallery" >
    
      <a href="https://rphotogallery.herokuapp.com/">
    
        <img style = "height: 250px" src="images/camera.png" data-toggle="tool-tip" title = "HTML, CSS, React, Bootstrap" alt="camera" style="width:100%">
    
        <div class="caption">
    
          <p>React Photo Gallery</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    

    
  <div class="col-md-4" >
    
    <div class="thumbnail" id = "roulette">
    
      <a href="https://dennismarkham.github.io/Roulette/">
    
        <img  style = "height: 250px" src="images/wheel.png" alt="roulette wheel" style="width:100%" data-toggle="tool-tip" title = "HTML, CSS, Javascript, Javascript Animation, JQuery, Bootstrap">
    
        <div class="caption">
    
          <p>Javascript Roulette Wheel <span style = "color:red; font-style:bold;">(WIP)</span></p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    
</div>
    

    
<div class = "row">
    
<div class = "col-md-1">
    
</div>
    
<h1 style="padding: 5px; display: inline; border-radius:25px;">Works in Progress (Solo)</h1>
    
<hr>
    
<br>
    
<br>
    
</div>
    

    
<div class="row">
    
  <div class = "col-md-2"></div>
    

    

    
   <div class="col-md-4" onmouseover="wiping()">
    
    <div class="thumbnail" id = "whiteboard" >
    
      <a href="https://dennismarkham.github.io/Angular_Whiteboard/">
    
        <img style = "height: 250px" src="images/whiteboard.png" alt="whiteboard" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, Angular.js">
    
        <div class="caption">
    
    <p>AngularJS Whiteboard <span style = "color:red; font-style:bold;">(WIP)</span></p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    

    

    

    
  <div class = "col-md-2"></div>
    
</div>
    

    

    
<div class = "row">
    
<div class = "col-md-1">
    
</div>
    
<h1 style="padding: 5px; display: inline; border-radius:25px;">Group Work</h1>
    
<hr>
    
<br>
    
<br>
    
</div>
    

    
<div class="row">
    
  <div class = "col-md-2"></div>
    

    

    
   <div class="col-md-4"  onmouseover = "typing()">
    
    <div class="thumbnail" id = "chatroom">
    
      <a href="https://cacheualcorner.herokuapp.com/">
    
        <img src="images/CC.png" alt="Cache-ual Corner (chat room)" style="width:100%" data-toggle= "tool-tip" title = "HTML, CSS, Javascript, JQuery, SQL, Express, Moment.JS">
    
        <div class="caption">
    
          <p>Cache-ual Corner</p>
    
        </div>
    
      </a>
    
    </div>
    
  </div>
    

    
  <div class="col-md-4">
    
  </div>
    
  <div class = "col-md-2"></div>
    
</div>
    

    
</div>
    
<script>
    

    
//on click of .thumbnail a local storage variable with the name of this.id is set to true
    
//first need to set the variables in local storage and make them false...right?
    

    

    
$(".thumbnail").click(function()
    
{
    
  console.log("function firing: setting " + this.id + " to true");
    

    
  localStorage.setItem(this.id, true);
    
//set visited to true
    
})
    
//QUESTIONS:
    
//-Train sound and magic sound
    
var trainSound = new Audio("train.wav");
    
  trainSound.volume = 0.1;
    
  var crystalSound = new Audio("crystal.wav");
    
  crystalSound.volume = 0.25;
    
   var shutterSound = new Audio("shutter.wav");
    
   shutterSound.volume = 0.2;
    
  var thunderSound = new Audio("thunder.wav");
    
  thunderSound.volume = 0.15;
    
  var boomSound = new Audio("boom.mp3");
    
  boomSound.volume = 0.15;
    
  var typingSound = new Audio("typing.wav");
    
  typingSound.volume = 0.15;
    
  var wipingSound = new Audio("wiping.wav");
    
  wipingSound.volume = 0.5;
    

    
  function showStuff() {
    
    $("#content").fadeIn("slow");
    

    
    var visitedTrain = localStorage.getItem("trainTimer");
    

    
    if (visitedTrain == true)
    
    {
    
      console.log("train timer visited");
    
    }
    
}
    

    

    
 function train(){
    
  trainSound.play();
    
  console.log("Playing train");
    
 }
    
 function crystal(){
    
  crystalSound.play();
    
  console.log("Playing crystal");
    
 }
    
 function shutter(){
    
 shutterSound.play();
    
 console.log("Playing shutter");
    
 }
    
 function thunder(){
    
  thunderSound.play();
    
  console.log("Playing thunder");
    
 }
    
 function boom(){
    
  boomSound.play();
    
  console.log("Playing boom");
    
 }
    
function typing(){
    
  typingSound.play();
    
  console.log("playing typing");
    
}
    
function wiping(){
    
  wipingSound.play();
    
  console.log("playing wiping");
    
}
    
</script>
    
</body>
    
</html>





    javascript jquery html local-storage persistent







    share|improve this question

























      0












      0








      0








      Greetings denizens of StackOverflow. I'm trying to do a simple trick using local storage on my portfolio. When the user visits one of my projects, it sets a variable in local storage so that when the user comes back, the console will say "train timer visited" in the console.



      This doesn't work. The first function fires, but upon return it does not say I have visited the respect project in the console. What is going on?



      Here are the two most important functions:



      $(".thumbnail").click(function()
      
{
      
  console.log("function firing: setting " + this.id + " to true");
      

      
  localStorage.setItem(this.id, true);
      
//set visited to true
      
})


      And:



        function showStuff() {
      
    $("#content").fadeIn("slow");
      

      
    var visitedTrain = localStorage.getItem("trainTimer");
      

      
    if (visitedTrain == true)
      
    {
      
      console.log("train timer visited");
      
    }
      
}


      Here is the entirety of my code:



      <!DOCTYPE html>
      
<html lang ="en-us">
      
<head>
      
  <meta charset="UTF-8">
      
  <title>Portfolio</title>
      

      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      
  <link rel="stylesheet" type="text/css" href="style.css">
      

      
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
      
   <style>
      

      
  #content {
      
    display: none;
      
  }
      
  .thumbnail:hover {
      
    border-style: solid;
      
    border-width: 3px;
      
    border-color:#E67F18;
      
  }
      
</style>
      

      
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
      

      
   </head>
      

      

      

      

      
<body onload="showStuff()">
      

      

      
  <nav class="navbar navbar-default">
      
  <div class="container-fluid">
      
    <div class="navbar-header">
      
      <a class="navbar-brand" href="index.html">Dennis Markham</a>
      
    </div>
      
    <ul class="nav navbar-nav">
      
      <li><a href="index.html">About Me</a></li>
      
      <li class = "active"><a href="portfolio.html">Portfolio</a></li>
      
      <li><a href="contact.html">Contact</a></li>
      
    </ul>
      
  </div>
      
</nav>
      

      

      
<!-- <div class ="container">
      
<section class ="row">
      
<div class ="col-md-1">
      
</div>
      
<div class="col-md-10"> 
      
<a href = "https://dennismarkham.github.io/trainTime/"> <img class = "portfolio" src = "images/dummy_image.png" alt ="train simulator"><span class = "caption">Train Timer </span></img></a> 
      
<a href = "https://dennismarkham.github.io/week-4-game/"><img class = "portfolio" src = "images/dummy_image.png" alt ="crystal collector"></img></a>
      
<a href = "#"><img class = "portfolio" src = "images/dummy_image.png" alt ="coming soon..."></img></a>
      
</div>
      
<div class = "col-md-1">
      
  </div>
      
</section>
      
</div> -->
      
<div id = "content">
      

      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      

      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Solo Endeavors</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4"   onmouseover ="crystal()">
      
    <div class="thumbnail" id = "crystalCollector">
      
      <a href="https://dennismarkham.github.io/week-4-game/">
      
        <img style = "height: 250px" src="images/crystal.png" alt="Crystal" style="width:100%"
      
        data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
      
        <div class="caption">
      
          <p>Crystal Collector</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
<div class="col-md-4"  onmouseover = "train()">
      
    <div class="thumbnail" id = "trainTimer">
      
      <a href="https://dennismarkham.github.io/trainTime/">
      
        <img  style = "height: 250px" src="images/train2.png" alt="Train" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery, Moment.js, JSON, Bootstrap">
      
        <div class="caption">
      
          <p>Train Timer</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class = "col-md-2"></div>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4" onmouseover="boom()">
      
    <div class="thumbnail" id = "bombDefuser">
      
      <a href="https://dennismarkham.github.io/BombDefuser/">
      
        <img style = "height: 250px" src="images/bomb.png" alt="Bomb" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
      
        <div class="caption">
      
          <p>Bomb Defuser</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class="col-md-4"  onmouseover="thunder()">
      
    <div class="thumbnail" id = "weatherMonitor">
      
      <a href="https://dennismarkham.github.io/AustinWeatherV2/">
      
        <img  style = "height: 250px" src="images/weather.png" alt="weather" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, AJAX, Firebase">
      
        <div class="caption">
      
          <p>Austin Weather Monitor</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      
  <div class = "col-md-2"></div>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4"  onmouseover="shutter()">
      
    <div class="thumbnail" id = "reactGallery" >
      
      <a href="https://rphotogallery.herokuapp.com/">
      
        <img style = "height: 250px" src="images/camera.png" data-toggle="tool-tip" title = "HTML, CSS, React, Bootstrap" alt="camera" style="width:100%">
      
        <div class="caption">
      
          <p>React Photo Gallery</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      
  <div class="col-md-4" >
      
    <div class="thumbnail" id = "roulette">
      
      <a href="https://dennismarkham.github.io/Roulette/">
      
        <img  style = "height: 250px" src="images/wheel.png" alt="roulette wheel" style="width:100%" data-toggle="tool-tip" title = "HTML, CSS, Javascript, Javascript Animation, JQuery, Bootstrap">
      
        <div class="caption">
      
          <p>Javascript Roulette Wheel <span style = "color:red; font-style:bold;">(WIP)</span></p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
</div>
      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Works in Progress (Solo)</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      

      
   <div class="col-md-4" onmouseover="wiping()">
      
    <div class="thumbnail" id = "whiteboard" >
      
      <a href="https://dennismarkham.github.io/Angular_Whiteboard/">
      
        <img style = "height: 250px" src="images/whiteboard.png" alt="whiteboard" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, Angular.js">
      
        <div class="caption">
      
    <p>AngularJS Whiteboard <span style = "color:red; font-style:bold;">(WIP)</span></p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      

      

      
  <div class = "col-md-2"></div>
      
</div>
      

      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Group Work</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      

      
   <div class="col-md-4"  onmouseover = "typing()">
      
    <div class="thumbnail" id = "chatroom">
      
      <a href="https://cacheualcorner.herokuapp.com/">
      
        <img src="images/CC.png" alt="Cache-ual Corner (chat room)" style="width:100%" data-toggle= "tool-tip" title = "HTML, CSS, Javascript, JQuery, SQL, Express, Moment.JS">
      
        <div class="caption">
      
          <p>Cache-ual Corner</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class="col-md-4">
      
  </div>
      
  <div class = "col-md-2"></div>
      
</div>
      

      
</div>
      
<script>
      

      
//on click of .thumbnail a local storage variable with the name of this.id is set to true
      
//first need to set the variables in local storage and make them false...right?
      

      

      
$(".thumbnail").click(function()
      
{
      
  console.log("function firing: setting " + this.id + " to true");
      

      
  localStorage.setItem(this.id, true);
      
//set visited to true
      
})
      
//QUESTIONS:
      
//-Train sound and magic sound
      
var trainSound = new Audio("train.wav");
      
  trainSound.volume = 0.1;
      
  var crystalSound = new Audio("crystal.wav");
      
  crystalSound.volume = 0.25;
      
   var shutterSound = new Audio("shutter.wav");
      
   shutterSound.volume = 0.2;
      
  var thunderSound = new Audio("thunder.wav");
      
  thunderSound.volume = 0.15;
      
  var boomSound = new Audio("boom.mp3");
      
  boomSound.volume = 0.15;
      
  var typingSound = new Audio("typing.wav");
      
  typingSound.volume = 0.15;
      
  var wipingSound = new Audio("wiping.wav");
      
  wipingSound.volume = 0.5;
      

      
  function showStuff() {
      
    $("#content").fadeIn("slow");
      

      
    var visitedTrain = localStorage.getItem("trainTimer");
      

      
    if (visitedTrain == true)
      
    {
      
      console.log("train timer visited");
      
    }
      
}
      

      

      
 function train(){
      
  trainSound.play();
      
  console.log("Playing train");
      
 }
      
 function crystal(){
      
  crystalSound.play();
      
  console.log("Playing crystal");
      
 }
      
 function shutter(){
      
 shutterSound.play();
      
 console.log("Playing shutter");
      
 }
      
 function thunder(){
      
  thunderSound.play();
      
  console.log("Playing thunder");
      
 }
      
 function boom(){
      
  boomSound.play();
      
  console.log("Playing boom");
      
 }
      
function typing(){
      
  typingSound.play();
      
  console.log("playing typing");
      
}
      
function wiping(){
      
  wipingSound.play();
      
  console.log("playing wiping");
      
}
      
</script>
      
</body>
      
</html>





      javascript jquery html local-storage persistent







      share|improve this question














      Greetings denizens of StackOverflow. I'm trying to do a simple trick using local storage on my portfolio. When the user visits one of my projects, it sets a variable in local storage so that when the user comes back, the console will say "train timer visited" in the console.



      This doesn't work. The first function fires, but upon return it does not say I have visited the respect project in the console. What is going on?



      Here are the two most important functions:



      $(".thumbnail").click(function()
      
{
      
  console.log("function firing: setting " + this.id + " to true");
      

      
  localStorage.setItem(this.id, true);
      
//set visited to true
      
})


      And:



        function showStuff() {
      
    $("#content").fadeIn("slow");
      

      
    var visitedTrain = localStorage.getItem("trainTimer");
      

      
    if (visitedTrain == true)
      
    {
      
      console.log("train timer visited");
      
    }
      
}


      Here is the entirety of my code:



      <!DOCTYPE html>
      
<html lang ="en-us">
      
<head>
      
  <meta charset="UTF-8">
      
  <title>Portfolio</title>
      

      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      
  <link rel="stylesheet" type="text/css" href="style.css">
      

      
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
      
   <style>
      

      
  #content {
      
    display: none;
      
  }
      
  .thumbnail:hover {
      
    border-style: solid;
      
    border-width: 3px;
      
    border-color:#E67F18;
      
  }
      
</style>
      

      
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
      

      
   </head>
      

      

      

      

      
<body onload="showStuff()">
      

      

      
  <nav class="navbar navbar-default">
      
  <div class="container-fluid">
      
    <div class="navbar-header">
      
      <a class="navbar-brand" href="index.html">Dennis Markham</a>
      
    </div>
      
    <ul class="nav navbar-nav">
      
      <li><a href="index.html">About Me</a></li>
      
      <li class = "active"><a href="portfolio.html">Portfolio</a></li>
      
      <li><a href="contact.html">Contact</a></li>
      
    </ul>
      
  </div>
      
</nav>
      

      

      
<!-- <div class ="container">
      
<section class ="row">
      
<div class ="col-md-1">
      
</div>
      
<div class="col-md-10"> 
      
<a href = "https://dennismarkham.github.io/trainTime/"> <img class = "portfolio" src = "images/dummy_image.png" alt ="train simulator"><span class = "caption">Train Timer </span></img></a> 
      
<a href = "https://dennismarkham.github.io/week-4-game/"><img class = "portfolio" src = "images/dummy_image.png" alt ="crystal collector"></img></a>
      
<a href = "#"><img class = "portfolio" src = "images/dummy_image.png" alt ="coming soon..."></img></a>
      
</div>
      
<div class = "col-md-1">
      
  </div>
      
</section>
      
</div> -->
      
<div id = "content">
      

      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      

      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Solo Endeavors</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4"   onmouseover ="crystal()">
      
    <div class="thumbnail" id = "crystalCollector">
      
      <a href="https://dennismarkham.github.io/week-4-game/">
      
        <img style = "height: 250px" src="images/crystal.png" alt="Crystal" style="width:100%"
      
        data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
      
        <div class="caption">
      
          <p>Crystal Collector</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
<div class="col-md-4"  onmouseover = "train()">
      
    <div class="thumbnail" id = "trainTimer">
      
      <a href="https://dennismarkham.github.io/trainTime/">
      
        <img  style = "height: 250px" src="images/train2.png" alt="Train" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery, Moment.js, JSON, Bootstrap">
      
        <div class="caption">
      
          <p>Train Timer</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class = "col-md-2"></div>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4" onmouseover="boom()">
      
    <div class="thumbnail" id = "bombDefuser">
      
      <a href="https://dennismarkham.github.io/BombDefuser/">
      
        <img style = "height: 250px" src="images/bomb.png" alt="Bomb" style="width:100%" data-toggle="tool-tip" title="HTML, CSS, Javascript, JQuery">
      
        <div class="caption">
      
          <p>Bomb Defuser</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class="col-md-4"  onmouseover="thunder()">
      
    <div class="thumbnail" id = "weatherMonitor">
      
      <a href="https://dennismarkham.github.io/AustinWeatherV2/">
      
        <img  style = "height: 250px" src="images/weather.png" alt="weather" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, AJAX, Firebase">
      
        <div class="caption">
      
          <p>Austin Weather Monitor</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      
  <div class = "col-md-2"></div>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      
  <div class="col-md-4"  onmouseover="shutter()">
      
    <div class="thumbnail" id = "reactGallery" >
      
      <a href="https://rphotogallery.herokuapp.com/">
      
        <img style = "height: 250px" src="images/camera.png" data-toggle="tool-tip" title = "HTML, CSS, React, Bootstrap" alt="camera" style="width:100%">
      
        <div class="caption">
      
          <p>React Photo Gallery</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      
  <div class="col-md-4" >
      
    <div class="thumbnail" id = "roulette">
      
      <a href="https://dennismarkham.github.io/Roulette/">
      
        <img  style = "height: 250px" src="images/wheel.png" alt="roulette wheel" style="width:100%" data-toggle="tool-tip" title = "HTML, CSS, Javascript, Javascript Animation, JQuery, Bootstrap">
      
        <div class="caption">
      
          <p>Javascript Roulette Wheel <span style = "color:red; font-style:bold;">(WIP)</span></p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
</div>
      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Works in Progress (Solo)</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      

      
   <div class="col-md-4" onmouseover="wiping()">
      
    <div class="thumbnail" id = "whiteboard" >
      
      <a href="https://dennismarkham.github.io/Angular_Whiteboard/">
      
        <img style = "height: 250px" src="images/whiteboard.png" alt="whiteboard" style="width:100%" data-toggle = "tool-tip" title = "HTML, CSS, Javascript, JQuery, Angular.js">
      
        <div class="caption">
      
    <p>AngularJS Whiteboard <span style = "color:red; font-style:bold;">(WIP)</span></p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      

      

      

      
  <div class = "col-md-2"></div>
      
</div>
      

      

      
<div class = "row">
      
<div class = "col-md-1">
      
</div>
      
<h1 style="padding: 5px; display: inline; border-radius:25px;">Group Work</h1>
      
<hr>
      
<br>
      
<br>
      
</div>
      

      
<div class="row">
      
  <div class = "col-md-2"></div>
      

      

      
   <div class="col-md-4"  onmouseover = "typing()">
      
    <div class="thumbnail" id = "chatroom">
      
      <a href="https://cacheualcorner.herokuapp.com/">
      
        <img src="images/CC.png" alt="Cache-ual Corner (chat room)" style="width:100%" data-toggle= "tool-tip" title = "HTML, CSS, Javascript, JQuery, SQL, Express, Moment.JS">
      
        <div class="caption">
      
          <p>Cache-ual Corner</p>
      
        </div>
      
      </a>
      
    </div>
      
  </div>
      

      
  <div class="col-md-4">
      
  </div>
      
  <div class = "col-md-2"></div>
      
</div>
      

      
</div>
      
<script>
      

      
//on click of .thumbnail a local storage variable with the name of this.id is set to true
      
//first need to set the variables in local storage and make them false...right?
      

      

      
$(".thumbnail").click(function()
      
{
      
  console.log("function firing: setting " + this.id + " to true");
      

      
  localStorage.setItem(this.id, true);
      
//set visited to true
      
})
      
//QUESTIONS:
      
//-Train sound and magic sound
      
var trainSound = new Audio("train.wav");
      
  trainSound.volume = 0.1;
      
  var crystalSound = new Audio("crystal.wav");
      
  crystalSound.volume = 0.25;
      
   var shutterSound = new Audio("shutter.wav");
      
   shutterSound.volume = 0.2;
      
  var thunderSound = new Audio("thunder.wav");
      
  thunderSound.volume = 0.15;
      
  var boomSound = new Audio("boom.mp3");
      
  boomSound.volume = 0.15;
      
  var typingSound = new Audio("typing.wav");
      
  typingSound.volume = 0.15;
      
  var wipingSound = new Audio("wiping.wav");
      
  wipingSound.volume = 0.5;
      

      
  function showStuff() {
      
    $("#content").fadeIn("slow");
      

      
    var visitedTrain = localStorage.getItem("trainTimer");
      

      
    if (visitedTrain == true)
      
    {
      
      console.log("train timer visited");
      
    }
      
}
      

      

      
 function train(){
      
  trainSound.play();
      
  console.log("Playing train");
      
 }
      
 function crystal(){
      
  crystalSound.play();
      
  console.log("Playing crystal");
      
 }
      
 function shutter(){
      
 shutterSound.play();
      
 console.log("Playing shutter");
      
 }
      
 function thunder(){
      
  thunderSound.play();
      
  console.log("Playing thunder");
      
 }
      
 function boom(){
      
  boomSound.play();
      
  console.log("Playing boom");
      
 }
      
function typing(){
      
  typingSound.play();
      
  console.log("playing typing");
      
}
      
function wiping(){
      
  wipingSound.play();
      
  console.log("playing wiping");
      
}
      
</script>
      
</body>
      
</html>





      javascript jquery html local-storage persistent




      javascript jquery html local-storage persistent






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 24 '18 at 4:31









      DennisMDennisM

      407




      407
























          1 Answer
          1






          active

          oldest

          votes


















          2














          Depending on what browser you're using, local storage will most of the time store your values as strings, in this case, chrome and firefox will store your boolean as a string, thus, you need to check the string version of true ('true'), not the boolean version (true)



          function showStuff() {
          
  $("#content").fadeIn("slow");
          
  var visitedTrain = localStorage.getItem("trainTimer");
          

          
  if (visitedTrain == 'true') // Change true to 'true'
          
  {
          
    console.log("train timer visited");
          
  }
          
}





          share|improve this answer


























          • Thanks, but now it continues to say "train timer visited" even after I clear my history.

            – DennisM
            Nov 24 '18 at 5:43











          • @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

            – Nick Parsons
            Nov 24 '18 at 5:55











          • That's what I meant.

            – DennisM
            Nov 24 '18 at 6:16











          • @DennisM ok, so does this solve your question?

            – Nick Parsons
            Nov 24 '18 at 6:27











          • No, it does not.

            – DennisM
            Nov 24 '18 at 21:11











          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














          draft saved

          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53455142%2ftrying-to-use-local-storage-to-track-is-user-has-visited-page-not-working%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown

























          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          2














          Depending on what browser you're using, local storage will most of the time store your values as strings, in this case, chrome and firefox will store your boolean as a string, thus, you need to check the string version of true ('true'), not the boolean version (true)



          function showStuff() {
          
  $("#content").fadeIn("slow");
          
  var visitedTrain = localStorage.getItem("trainTimer");
          

          
  if (visitedTrain == 'true') // Change true to 'true'
          
  {
          
    console.log("train timer visited");
          
  }
          
}





          share|improve this answer


























          • Thanks, but now it continues to say "train timer visited" even after I clear my history.

            – DennisM
            Nov 24 '18 at 5:43











          • @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

            – Nick Parsons
            Nov 24 '18 at 5:55











          • That's what I meant.

            – DennisM
            Nov 24 '18 at 6:16











          • @DennisM ok, so does this solve your question?

            – Nick Parsons
            Nov 24 '18 at 6:27











          • No, it does not.

            – DennisM
            Nov 24 '18 at 21:11
















          2














          Depending on what browser you're using, local storage will most of the time store your values as strings, in this case, chrome and firefox will store your boolean as a string, thus, you need to check the string version of true ('true'), not the boolean version (true)



          function showStuff() {
          
  $("#content").fadeIn("slow");
          
  var visitedTrain = localStorage.getItem("trainTimer");
          

          
  if (visitedTrain == 'true') // Change true to 'true'
          
  {
          
    console.log("train timer visited");
          
  }
          
}





          share|improve this answer


























          • Thanks, but now it continues to say "train timer visited" even after I clear my history.

            – DennisM
            Nov 24 '18 at 5:43











          • @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

            – Nick Parsons
            Nov 24 '18 at 5:55











          • That's what I meant.

            – DennisM
            Nov 24 '18 at 6:16











          • @DennisM ok, so does this solve your question?

            – Nick Parsons
            Nov 24 '18 at 6:27











          • No, it does not.

            – DennisM
            Nov 24 '18 at 21:11














          2












          2








          2







          Depending on what browser you're using, local storage will most of the time store your values as strings, in this case, chrome and firefox will store your boolean as a string, thus, you need to check the string version of true ('true'), not the boolean version (true)



          function showStuff() {
          
  $("#content").fadeIn("slow");
          
  var visitedTrain = localStorage.getItem("trainTimer");
          

          
  if (visitedTrain == 'true') // Change true to 'true'
          
  {
          
    console.log("train timer visited");
          
  }
          
}





          share|improve this answer















          Depending on what browser you're using, local storage will most of the time store your values as strings, in this case, chrome and firefox will store your boolean as a string, thus, you need to check the string version of true ('true'), not the boolean version (true)



          function showStuff() {
          
  $("#content").fadeIn("slow");
          
  var visitedTrain = localStorage.getItem("trainTimer");
          

          
  if (visitedTrain == 'true') // Change true to 'true'
          
  {
          
    console.log("train timer visited");
          
  }
          
}






          share|improve this answer














          share|improve this answer



          share|improve this answer








          edited Nov 24 '18 at 4:48

























          answered Nov 24 '18 at 4:41









          Nick ParsonsNick Parsons

          4,8622721




          4,8622721













          • Thanks, but now it continues to say "train timer visited" even after I clear my history.

            – DennisM
            Nov 24 '18 at 5:43











          • @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

            – Nick Parsons
            Nov 24 '18 at 5:55











          • That's what I meant.

            – DennisM
            Nov 24 '18 at 6:16











          • @DennisM ok, so does this solve your question?

            – Nick Parsons
            Nov 24 '18 at 6:27











          • No, it does not.

            – DennisM
            Nov 24 '18 at 21:11



















          • Thanks, but now it continues to say "train timer visited" even after I clear my history.

            – DennisM
            Nov 24 '18 at 5:43











          • @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

            – Nick Parsons
            Nov 24 '18 at 5:55











          • That's what I meant.

            – DennisM
            Nov 24 '18 at 6:16











          • @DennisM ok, so does this solve your question?

            – Nick Parsons
            Nov 24 '18 at 6:27











          • No, it does not.

            – DennisM
            Nov 24 '18 at 21:11

















          Thanks, but now it continues to say "train timer visited" even after I clear my history.

          – DennisM
          Nov 24 '18 at 5:43





          Thanks, but now it continues to say "train timer visited" even after I clear my history.

          – DennisM
          Nov 24 '18 at 5:43













          @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

          – Nick Parsons
          Nov 24 '18 at 5:55





          @DennisM You need to “clear browsing data” see this answer, or if you want to remove the storage key manually using code you can use localStorage.removeItem(“trainTimer”)

          – Nick Parsons
          Nov 24 '18 at 5:55













          That's what I meant.

          – DennisM
          Nov 24 '18 at 6:16





          That's what I meant.

          – DennisM
          Nov 24 '18 at 6:16













          @DennisM ok, so does this solve your question?

          – Nick Parsons
          Nov 24 '18 at 6:27





          @DennisM ok, so does this solve your question?

          – Nick Parsons
          Nov 24 '18 at 6:27













          No, it does not.

          – DennisM
          Nov 24 '18 at 21:11





          No, it does not.

          – DennisM
          Nov 24 '18 at 21:11


















          draft saved

          draft discarded




















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid …



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53455142%2ftrying-to-use-local-storage-to-track-is-user-has-visited-page-not-working%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          -

          Popular posts from this blog

          A CLEAN and SIMPLE way to add appendices to Table of Contents and bookmarks

          Image
          0 I found a lot of questions abount appendices and ToC. Many users want appendices to be grouped in an Appendix part, however some problems arise with ToC, hyperref, PDF viewer bookmarks, and so on. There are different solutions which require extra packages, command patching and other extra code, however none of them satisfies me. I almost found an easy way to accomplish a good result, where appendices are added to bookmarks in the right way and hyperref links point to the right page. However, the number of the "Appendix" part page is wrong (it's the number of appendix A). Is there any EASY way to fix that? This is a MWE: documentclass{book} usepackage[nottoc,notlot,notlof]{tocbibind} usepackage{hyperref} begin{document} frontmatter tableofcontents mainmatter part{First} chapter{...
          Read more

          Calculate evaluation metrics using cross_val_predict sklearn

          Image
          1 In the sklearn.model_selection.cross_val_predict page it is stated: Generate cross-validated estimates for each input data point. It is not appropriate to pass these predictions into an evaluation metric. Can someone explain what does it mean? If this gives estimate of Y (y prediction) for every Y (true Y), why can't I calculate metrics such as RMSE or coefficient of determination using these results? python scikit-learn cross-validation share | improve this question edited Nov 28 '18 at 17:52 desertnaut 20.3k 7 43 79 ...
          Read more

          Insert data from modal to MySQL (multiple modal on website)

          Image
          0 I have problem with inserting data to MySQL from modal. My modal: <a href="#" class="badge badge-pill badge-success">6 komentarzy</a> <a href="#" class="badge badge-pill badge-danger">brak komentarzy</a> <a data-toggle="modal" href="#add_desk_comm_{$desk_['desk_id']}" data-target="#add_desk_comm_{$desk_['desk_id']}" class="ediiit">(dodaj)</a> <div class="modal fade" id="add_desk_comm_{$desk_['desk_id']}" tabindex="-1" role="dialog" aria-labelledby="edit_printer" aria-hidden="true"> <div class="modal-dialog" role="document"> ...
          Read more