如何在 javascript 中创建带有 cookie 的弹出窗口？答案

【问题标题】：how to create a popup with cookies in javascript?如何在 javascript 中创建带有 cookie 的弹出窗口？
【发布时间】：2017-09-07 02:21:12
【问题描述】：

我正在尝试创建一个弹出窗口并设置 cookie 在 30 秒内过期，并在页面加载一次时显示一个弹出窗口。问题是我的弹出窗口它弹出但我的 cookie 不起作用我不知道我的代码有什么问题我厌倦了一些东西但它没有工作我也看了一些视频。如果可以的话，我从今天早上开始工作帮助我让我的一天。任何帮助提前感谢它。

<!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>

【问题讨论】：

不相关，但我认为集成到您网站的方式会拒绝/惹恼客户。
您在加载之前调用 createCookie()。看一眼你的控制台就会发现......
您在定义函数之前似乎在调用createCookie()，您在定义函数后尝试调用它吗？
感谢@Jonasw 花时间回答我的问题。我之前把它放在但还是没用
@DiegoRosales 兄弟怎么样？

标签： javascript jquery html bootstrap-modal

【解决方案1】：

调用“createCookie()”时不传递参数，因此名称和值未定义，导致cookie设置错误。

此外，您添加的用于创建 cookie 的脚本将在页面加载时被调用。即使模态框没有显示，它仍然会被加载，因此会调用 createCookie() 函数。如果您希望在弹出窗口弹出时调用它，请将该行添加到上面的 jquery 中：

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

【讨论】：

谢谢@sebitommy123 我把这个放了，但还是不行 $(document).ready(function(){ $("#myModal").modal('show'); createCookie("createCookie ()",30*1000;"); });
你有没有试过调试并在document.ready函数中放一个console.log()看是否被调用。