Question

我有一个对比度更改脚本，该脚本设置cookie并在页面加载时获取它们。这是在带有控制台日志的Codepen上的工作结果：“对比从cookie加载的greenmonochrome！”，但是在Webhost上，该函数不会找到任何cookie，并响应“未找到cookie！”。到控制台日志。

我已经多次检查了该代码，搜索了其他相关答案，但我不知道为什么此代码在我的Web主机上不起作用。

请问您有什么想法或建议吗？ BR 马赛厄斯

Codepen：https://codepen.io/matt-prime/pen/abzGEoY

    // CONTRAST CHANGER
    $(document).ready(function(){
      console.log( "Event Listener ready!" );

      // CHECK FOR COOKIE
      var x = document.cookie;
      if(x=='blackwhite') {
        blackwhite();
        console.log( "Contrast blackwhite loaded from cookie!" );
      }

      else if(x=='whiteblack') {
        whiteblack();
        console.log( "Contrast whiteblack loaded from cookie!" );
      }

      else if(x=='yellowblue') {
        yellowblue();
        console.log( "Contrast yellowblue loaded from cookie!" );
      }

      else if(x=='blueyellow') {
        blueyellow();
        console.log( "Contrast blueyellow loaded from cookie!" );
      }

      else if(x=='bernsteinmonochrome') {
        bernsteinmonochrome();
        console.log( "Contrast bernsteinmonochrome loaded from cookie!" );
      }

      else if(x=='greenmonochrome') {
        greenmonochrome();
        console.log( "Contrast greenmonochrome loaded from cookie!" );
      }

      else if(x=='commodore64') {
        commodore64();
        console.log( "Contrast commodore64 loaded from cookie!" );
      }

      else {console.log( "No cookies found!" );
      }

      // CONTRAST DEFAULT
      $(".change-reset").click(function(){
     $("*").removeClass("contrast-black-white contrast-white-black contrast-yellow-blue contrast-blue-yellow contrast-monochrome-bernstein contrast-monochrome-gruen contrast-commodore64");
        // RESET COOKIE
        document.cookie=1
        console.log( "Contrast cookie reset!" );
      });

      // CONTRAST BLACK WHITE
      $(".changeBW").click(function(){blackwhite();});

      // CONTRAST WHITE BLACK
      $(".changeWB").click(function(){whiteblack();});

      // CONTRAST YELLOW BLUE
      $(".changeYB").click(function(){yellowblue();});

      // CONTRAST BLUE YELLOW
      $(".changeBY").click(function(){blueyellow()});

      // KONTRAST BERNSTEIN MONOCHROM
      $(".changeBM").click(function(){bernsteinmonochrome()});

      // CONTRAST GREEN MONOCHROM
      $(".changeGM").click(function(){greenmonochrome()});

      // CONTRAST COMMODORE 64
      $(".changeC64").click(function(){commodore64()});

    // CONTRAST LAYOUT CSS CLASSES
    function blackwhite(){
      $("*").removeClass("contrast-black-white contrast-white-black contrast-yellow-blue contrast-blue-yellow contrast-monochrome-bernstein contrast-monochrome-gruen contrast-commodore64");
      $("*").addClass("contrast-black-white");
      $("i.icon.fas.fa-adjust.contrast-black-white").removeClass("contrast-black-white");
      $("span.btn-label.contrast-black-white").removeClass("contrast-black-white");
      document.cookie = 'blackwhite';
      console.log( "Contrast cookie blackwhite set!" );
    }

    function whiteblack(){
      $("*").removeClass("contrast-black-white contrast-white-black contrast-yellow-blue contrast-blue-yellow contrast-monochrome-bernstein contrast-monochrome-gruen contrast-commodore64");
      $("*").addClass("contrast-white-black");
      $("i.icon.fas.fa-adjust.contrast-white-black").removeClass("contrast-white-black");
      $("span.btn-label.contrast-white-black").removeClass("contrast-white-black");
      document.cookie = 'whiteblack';
      console.log( "Contrast cookie whiteblack set!" );
    }

    function yellowblue(){
      $("*").removeClass("contrast-black-white contrast-white-black contrast-yellow-blue contrast-blue-yellow contrast-monochrome-bernstein contrast-monochrome-gruen contrast-commodore64");
      $("*").addClass("contrast-yellow-blue");
      $("i.icon.fas.fa-adjust.contrast-yellow-blue").removeClass("contrast-yellow-blue");
      $("span.btn-label.contrast-yellow-blue").removeClass("contrast-yellow-blue");
      document.cookie = 'yellowblue';
      console.log( "Contrast cookie yellowblue set!" );
    }

    function blueyellow(){
       $("*").removeClass("contrast-black-white contrast-white-black contrast-yellow-blue contrast-blue-yellow contrast-monochrome-bernstein contrast-monochrome-gruen contrast-commodore64");
      $("*").addClass("contrast-blue-yellow");
      $("i.icon.fas.fa-adjust.contrast-blue-yellow").removeClass("contrast-blue-yellow");
      $("span.btn-label.contrast-blue-yellow").removeClass("contrast-blue-yellow");
      document.cookie = 'blueyellow';
      console.log( "Contrast cookie blueyellow set!" );
    }


  })

Answer 1

对我来说，对于Codepen也不起作用。我认为发生了以下情况

您有时会在codepen中运行代码，以所需的值创建cookie
cookie保留在它们运行的域中，尤其是当它们中没有到期日期时
现在，当您在Codepen中运行页面时，您会得到结果。

清除codepen中的cookie，然后看看结果是否相同。那是有道理的。

您必须将cookie设置在某个地方（并且没有代码可以这样做）。然后，在页面加载时，它将检查该值。

您可以从服务器端返回非HTTP cookie，以设置cookie的值。实施取决于后端技术。您也可以在Web服务器上注入cookie。

设置cookie的唯一位置是已设置cookie并在功能中对其进行重新设置。

代码可以在Codepen中使用，但不能在我的网络主机上使用

1 个答案: