Question

当用户在页面上接受Cookie时，我正在存储Cookie 一旦他们这样做，它将反过来阻止他们访问时看到弹出窗口。

虽然当我在body onload中调用read cookie脚本时，它什么也没做。

设置了Cookie，因为我可以在Chrome内容设置中看到它。

我试图这样做的方法是调用一个名为cookieornot（）的外部.js函数调用另一个函数并将返回值存储为变量

我的cookieornot（）代码是：

  function cookieornot(){
    var result = readCookie("acceptcookies");
    if (result) {
      document.getElementById('acceptcookies').style.display = 'none';
    } else {
      document.getElementById('acceptcookies').style.display = 'block';
    }
  }

我的readcookie（）代码是

function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}

在我的HTML文件中，我有外部.js文件，其中包含两个函数引用

<script src="assets/js/ordersys.js"></script>

我的HTML部分是：（DIV ID =＆＃34; acceptCookies＆＃34;如果设置了cookie，则应该隐藏）

<body onload='cookieornot()'> <a href="#" class="scrollToTop w3-btn fa fa-chevron-circle-up fa-2x">
    </a>
    <!-- Modal -->
    <nav class="w3-sidenav w3-white w3-card-8 w3-animate-left w3-center" style="display:none;z-index:4;width:70px"

      id="mySidenav"> </nav>
    <!-- Overlay -->
    <div id="id02" class="w3-modal"> </div>
    <div id="id01" class="w3-modal"> </div>
    <div id="id03" class="w3-modal"> </div>
    <!-- Begin Code Here -->
    <div id="Header"></div>
    <div id="acceptCookies" class="w3-panel w3-blue w3-card-12" style="position:fixed;bottom:0px;right:0px;width:100%;">
      <span onclick="this.parentElement.style.display='none'" class="w3-closebtn">&times;</span>
      <h3>This Site Uses Cookies</h3>
      <p>We use cookies to help improve the function of this site. <a href=cookies.html>Learn More</a></p>
      <button class="w3-btn w3-round-xxlarge" onclick="acceptCookies()">I Accept Cookies</button><br><br>
    </div>

所以只是迭代，cookie被正确设置：

姓名：acceptcookies 内容：是的域名：.XXXXX.XXXX 路径：/ 发送：任何类型的连接可访问脚本：是的创建时间：2017年2月14日星期二下午5:30:47 到期日：2018年2月14日星期三下午5:30:47

但如果设置了acceptcookies cookie，则此代码不会隐藏div，就像预期的那样。

我可以从body onload切换到这里：

<script type="text/javascript">
        $(document).ready(function() {
        $('#mySidenav').load('assets/static_html/navbar_links.html');
        $('#Header').load('assets/static_html/header_on.html');
        $('#Footer').load('assets/static_html/footer.html');
        $('#id02').load('assets/static_html/email_modal.html');
        $('#id01').load('assets/static_html/phone_modal.html');

        $(window).scroll(function(){
          if ($(this).scrollTop() > 100) {
          $('.scrollToTop').fadeIn();
          } else {
          $('.scrollToTop').fadeOut();
          }
        });
        //Click event to scroll to top
        $('.scrollToTop').click(function(){
          $('html, body').animate({scrollTop : 0},800);
          return false;
        });
      });
    </script>

如果是这样我将如何去做呢？

Answer 1

根据readCookie的编写方式，您可以在cookie中更改此行或不从

更改

if (result === "True") {

到

if(result) {

因为如果找不到cookie，那么它将返回null。只有在真实的情况下才会创建cookie。希望这会有所帮助。

第2部分因为你已经有了一个jQuery.ready事件，我们可以利用它在整个DOM加载后运行该函数。下面我将函数调用添加到帖子底部的javascript片段。您需要将其从正文载入中删除。

$(document).ready(function() {
    $('#mySidenav').load('assets/static_html/navbar_links.html');
    $('#Header').load('assets/static_html/header_on.html');
    $('#Footer').load('assets/static_html/footer.html');
    $('#id02').load('assets/static_html/email_modal.html');
    $('#id01').load('assets/static_html/phone_modal.html');

    $(window).scroll(function(){
      if ($(this).scrollTop() > 100) {
      $('.scrollToTop').fadeIn();
      } else {
      $('.scrollToTop').fadeOut();
      }
    });
    //Click event to scroll to top
    $('.scrollToTop').click(function(){
      $('html, body').animate({scrollTop : 0},800);
      return false;
    });

    cookieornot();  // Function added here.
  });

Answer 2

我必须从外部javascript中删除cookieornot（）函数，然后将其放在正文底部的标记中，现在一切看起来都很好。我不是肯定为什么我必须这样做...

我仍然会调用cookieornot（），但现在它可以正常工作。

通过javascript读取cookie有错误

2 个答案: