how to create a popup with cookies in javascript?

问题

I'm trying to create a pop up and set cookies expire in 30 sec and displays a popup when the page loads just once . the problem is my popup it pop ups but my cookies does not work I do not know whats wrong with my code i tired few things but it did not work also i watched few videos.I'm working on this since this morning if you could help me with you are making my day.any help appreciate it in advance.

<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Bootstrap Core CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <!-- Latest jQuery Library -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <!-- Bootstrap Core JS -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <!-- Cookie JS for Modal -->
  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.0/jquery.cookie.min.js"></script>
  <script type="text/javascript">
	$(document).ready(function(){
		$("#myModal").modal('show');
	});
	
	
</script>
</head>

<body>

<div class="container-fluid">
<div id="myModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h3>REGISTER FOR FALL SESSION</h3>
			    
            </div>
			
            <div class="modal-body">
			<div class="row">
				<div class="col-xs-12 col-sm-6">
                <img src="gym.png" alt="gym_promo" style="width:304px;">
				</div>
				
			<div class="col-xs-12 col-sm-6">
				<h3> Reserve Your Spot Today </h3>
				<p> EMAIL : <a href="mailto:PLAYATGYM@GMAIL.COM" target="_top">PLAYATGYM@GMAIL.COM </a> </p>
				
				<p>OR CALL :<a href="514-795-4266"> 514-795-4266</a> </p>
				
				
				<script>createCookie();</script>
						  
            </div>
			</div>
			</div>
        </div>
    </div>
</div>
</div>

  <script>
   function createCookie(name, value) {
   var date = new Date();
   date.setTime(date.getTime()+(30*1000));
   var expires = "; expires="+date.toGMTString();

   document.cookie = name+"="+value+expires+"; path=/";
}
  </script>

</body>
</html>

回答1:

When you call "createCookie()" you don't pass parameters, and so name and value are undefined, setting the cookie incorrectly.

Also, the script you added to create the cookie will be called when the page loads. Even if the modal isn't shown, it is still loaded, and so the createCookie() function is called. If you want it to be called when the popup pops up, add the line to the jquery you have above:

$(document).ready(function(){
    $("#myModal").modal('show');
    createCookie("name of cookie","value of cookie");
});

来源：https://stackoverflow.com/questions/46081553/how-to-create-a-popup-with-cookies-in-javascript

标签

javascript

jquery

html

bootstrap-modal