如果有 cookie 则隐藏代码

Question

我尝试了各种不同的代码，php、javascript，但我无法让它按照我想要的方式工作。让我解释一下：

首先，我的代码应该检查 cookie。如果有 cookie，则不应显示此代码：

<ul>
  <li><a id="demo03" href="#modal-03">DEMO03 7</a>
  </li>
</ul>




<!--DEMO03-->
<div id="modal-03" style="background-image:url(images/access.jpg); background-size:cover;">
  <!--"THIS IS IMPORTANT! to close the modal, the class name has to match the name given on the ID-->
  <div id="btn-close-modal" class="close-modal-03">
    <!--CLOSE MODAL-->
  </div>

  <div class="modal-content">
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <img src="images/logo.png" />
    <br />
    <br />
    <font color="#bfbaa8">Man skal være over 18 år, for at få adgang til denne side.<br />
                <font size="+4">Indtast dit fødselsår</font>
    <br />
    <input maxlength="4" id="age_validation_input" size="33" align="middle" style="background-color: rgba(191, 186, 168, 0.8); border:none; height:90px; width:380px; color:#3d3b33; padding:15px; font-size:70px; font-weight:bold;" value="F.eks. 1963" onblur="if (this.value == '') {this.value = 'F.eks. 1963';}"
    onfocus="if (this.value == 'F.eks. 1963') {this.value = '';}">
    </font>
    <br />
    <input type="button" id="age_validation_btn" align="middle" style="background-color: rgba(99, 95, 82, 0.8); border:none; height:65px; width:410px; color:#c4bda4; font-size:40px; font-weight:bold;" value="OK" />
    <br />
    <br />
    <font size="-1" color="#69665b">Ved at klikke "OK" giver du tilladelse til, at webstedet benytter cookies.</font>
  </div>
</div>

然后我有一个javascript sn-p。如果一切正常，应该设置一个 cookie（进入站点时将被搜索的 cookie，如上所述）。这是代码，/////////// 是应该创建 cookie 的位置。

$('#age_validation_btn').on('click', function() {

  var age = parseInt($('#age_validation_input').val(), 10);
  var currentYear = (new Date).getFullYear();
  var calculatedYear = currentYear - 123;
  var oldage = age - calculatedYear;

  if (age > currentYear) {
    swal("Hov!", "Vi er ikke nået til det år endnu.", "error");
    return false;
  }

  if (oldage < 5) {
    swal("Hov!", "Du skal indtaste et gyldigt fødselsår.", "error");
    return false;
  }

  if (isNaN(age) || age == 'F.eks. 1963') {
    swal("Hov!", "Du skal indtaste dit fødselsår, for at få adgang til denne side.", "error");
    return false; //stop the validation here
  }

  if (new Date().getFullYear() - age >= 18) {
    //////////////////////////////
    //////////////////////////////
    //////////////////////////////
    $('#btn-close-modal').trigger('click');
  } else {
    location.href = 'noaccess.html';
  }
});

谁能帮帮我？我已经尝试了很长一段时间了，但没有运气:-(

举个例子，我试过这个...... 这段代码是应该隐藏代码的代码：

<?php
if(!isset($_COOKIE[$cookie_name])) {
    // nothing should happen, pass user
} else {
    echo '
  <ul>
    <li><a id="demo03" href="#modal-03">DEMO03 7</a>
    </li>
  </ul>




  <!--DEMO03-->
  <div id="modal-03" style="background-image:url(images/access.jpg); background-size:cover;">
    <!--"THIS IS IMPORTANT! to close the modal, the class name has to match the name given on the ID-->
    <div id="btn-close-modal" class="close-modal-03">
      <!--CLOSE MODAL-->
    </div>

    <div class="modal-content">
      <br />
      <br />
      <br />
      <br />
      <br />
      <br />
      <img src="images/logo.png" />
      <br />
      <br />
      <font color="#bfbaa8">Man skal være over 18 år, for at få adgang til denne side.<br />
                <font size="+4">Indtast dit fødselsår</font>
      <br />
      <input maxlength="4" id="age_validation_input" size="33" align="middle" style="background-color: rgba(191, 186, 168, 0.8); border:none; height:90px; width:380px; color:#3d3b33; padding:15px; font-size:70px; font-weight:bold;" value="F.eks. 1963">
      </font>
      <br />
      <input type="button" id="age_validation_btn" align="middle" style="background-color: rgba(99, 95, 82, 0.8); border:none; height:65px; width:410px; color:#c4bda4; font-size:40px; font-weight:bold;" value="OK" />
      <br />
      <br />
      <font size="-1" color="#69665b">Ved at klikke "OK" giver du tilladelse til, at webstedet benytter cookies.</font>
    </div>
  </div>
    ';
}
?>

这是应该创建 cookie 的部分：

$('#age_validation_btn').on('click', function() {

    var age = parseInt($('#age_validation_input').val(), 10);
    var currentYear = (new Date).getFullYear();
    var calculatedYear = currentYear - 123;
    var oldage = age - calculatedYear;

    if(age > currentYear) {
        swal("Hov!", "Vi er ikke nået til det år endnu.", "error");
        return false;
    }

    if(oldage < 5) {
        swal("Hov!", "Du skal indtaste et gyldigt fødselsår.", "error");
        return false;
    }

    if(isNaN(age) || age == 'F.eks. 1963') {
        swal("Hov!", "Du skal indtaste dit fødselsår, for at få adgang til denne side.", "error");
        return false;//stop the validation here
    }

    if(new Date().getFullYear() - age >= 18) {  
        <? $cookie_name = "user"; ?>
        $('#btn-close-modal').trigger('click'); 
    } else {
        location.href = 'noaccess.html';
    }
});

Answer 1

1. PHP - 如果未设置 cookie，则显示代码，而不是在设置时隐藏代码：

<?php
if(!isset($_COOKIE["user"])) { ?>
  <ul>
    <li><a id="demo03" href="#modal-03">DEMO03 7</a>
    </li>
  </ul>
<?php } ?>

1. JS - 使用https://github.com/js-cookie/js-cookie：

if (new Date().getFullYear() - age >= 18) { 
     Cookies.set("user","ok");
     $('#btn-close-modal').trigger('click');
 } else {
     Cookies.remove("user");
    location.href = 'noaccess.html';
 }

这假设您想在他们下次访问时隐藏 UL

Answer 2

如果你想隐藏 html，当没有设置 cookie 时，比从这里修改你的 php 代码：

if(!isset($_COOKIE[$cookie_name])) {
    // nothing should happen, pass user
} else {
//your html code here
}

到这里：

if(!isset($_COOKIE[$cookie_name])) {
//your html code here
}

（注意isset函数前的感叹号）

Answer 3

您可以使用这些函数来创建和获取cookie（此示例来自：http://www.w3schools.com/js/js_cookies.asp）

var getCookie = function(cname) {
var name = cname + "=";
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);
    if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
    return "";
}

var setCookie = function(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

要设置你的cookie，请使用：

setCookie("MyCookie", "MyValue", 365)

在您的文档就绪功能中，您可以使用它进行测试

getCookie("MyCookie")