通过javascript读取Cookie时出错_Javascript_Html_Cookies

通过javascript读取Cookie时出错

javascript html cookies

通过javascript读取Cookie时出错,javascript,html,cookies,Javascript,Html,Cookies,当用户在页面上接受cookie时，我正在存储cookie。。。。一旦他们这样做了，它将反过来阻止一个人在访问时看到弹出窗口虽然当我在body onload中调用readcookie脚本时，它什么也不做 cookie的设置与我在chrome内容设置中看到的相同我尝试这样做的方式是调用名为cookieornot的外部.js中的一个函数，该函数调用另一个函数并将返回存储为变量我的cookieornot代码是： function cookieornot(){ var result =

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

虽然当我在body onload中调用readcookie脚本时，它什么也不做

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=acceptCookie如果设置了cookie，则应隐藏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

我是否可以从车身空载切换到这里：

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

如果是这样的话，我该怎么做呢？

根据readCookie的编写方式，您可以在cookie中更改这一行，也可以不更改

if (result === "True") {

到

因为如果它没有找到cookie，那么它将返回null。只有当cookie为true时，才会创建cookie。希望这有帮助

第二部分因为您已经有了jQuery.ready事件，所以我们可以利用它在加载整个DOM后运行函数。下面，我在您文章底部的javascript段中添加了函数调用。您需要将其从body onload中移除

$(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.
  });

我不得不从外部javascript中删除cookieornot函数，然后将其放在正文底部的标记中，现在一切看起来都很好，工作正常。我不确定我为什么要这样做

我仍然调用Cookie，但现在它起作用了。< /P>通过JavaScript读取cookies有错误。我们需要猜出错误是什么吗？AcctotCookie与接受Cookie不一样。因为cookie数据只需要客户端，在这种情况下，请考虑使用LoalStor来代替。这使得HTTP请求更快，因为需要的数据更少，并且来自服务器的响应更易于缓存。它也比cookies更容易使用。它没有解决这个问题，但它的代码较短，所以我非常感谢您的输入。您是否尝试向脚本添加了一些console.log？您知道它是否遵循您期望的工作流吗？控制台日志显示，它无法在cookieornotUncaught TypeError的第3行将属性样式设置为null。无法在cookieornot cookieornot.js:4 onload index:46处将属性“style”设置为null。因此，调用Functiono时，dom元素不存在。尝试在脚本标记的页面底部调用cookieornot函数，而不是在onload中。如果其他东西不起作用，也可以尝试将onload='cookieornot'更改为onload='cookieornot'。

$(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.
  });