javascript - 弹出框 javascript+PHP 代码混合不起作用？

Question

我正在做一个大型元素，其中包括一个带有 cookie 信息的弹出框，它只会在 session 中第一次打开，但在 javascript 和 PHP 的困惑中的某个地方，我似乎犯了一个错误或类似的东西它没有出现任何...

这是代码片段:

<div  id='popup' style='border-radius: 1vw; display: hidden; background-color: white; padding: 2vw; position: fixed; top: 20%; right: 25%; z-index: 999; width: 50vw; height: auto; margin-left: 15; margin-right: 15; border-style: solid; border-color: #181818; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);'>
<a  class="sidebar" style="position:absolute; top:0 ;right: 1vw;font-size: 36px; margin-left: 50px;" #href="javascript:void(0)" class="closebtn" onclick="closePopUp()">&times;</a> <!-- The button which activates Javascript to close the pop up box -->
<img id='cookiepic' src='cookie.jpg' style='width: 3vw; height: 3vw; display: hidden;'>
<p class='spacedfont' style='display: inline' > &nbsp Oh, and by the way...</p>
<hr>
<div style='display: flex; flex-direction: row; display:hidden;' id='cookieinfo'>
<p id='cookiep' style='letter-spacing: 1px;'>
As is common practice with almost all professional websites, this site uses cookies, which are tiny files that are downloaded to your computer, to improve your experience.
<br><br>This page describes what information they gather, how we use it and why we sometimes need to store these cookies.
<br><br>We will also share how you can prevent these cookies from being stored however this may downgrade or 'break' certain elements of the sites functionality.
<br><br>By closing this notice or continuing to use the site, you consent to our use of cookies.
</p>

</div>

<div style='display: flex; flex-direction: row; display:hidden;' id='aboutinfo'>
<p id='aboutp'>
We're a fresh business to the world of e-commerce that aims to bring you the best experience shopping online.
<br><br>Our business is based in the UK but our web of business relationships stretches worldwide to deliver you the best service.
<br><br>Part of our ethos is innovation, a key role in our success which allows us to scour the globe for offers and deals to bring to you almost daily. Be sure to check the featured panel for a taster of what we've found recently!
<br><br>If you'd like to know anything else, email a member of our friendly team at xxxxx@gmail.com
</p>

</div>
</div>




<script>
function closePopUp() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("cookieinfo").style.display = "none";
    document.getElementById("cookiepic").style.display = "none";
    document.getElementById("aboutinfo").style.display = "none";
}
function openPopUp() {
    document.getElementById("popup").style.display = "block";

}
function showCookie() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("cookieinfo").style.display = "inline";
    document.getElementById("cookiepic").style.display = "inline";
    <?php
    $_SESSION['cookieconsent'] = true;
    ?>
}
function showAbout() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("aboutinfo").style.display = "inline";
}

closePopUp();

<?php
if(empty($_SESSION['cookieconsent'])) {
    echo "showCookie()";
}
?>
</script>

有人知道怎么回事吗？任何帮助将不胜感激，郑重声明，我更喜欢保持 CSS 内联。

Answer 1

showCookie() 中的 php 代码将始终 执行(因为客户端 javascript 不影响服务器端 php 代码)。
所以当你到达按钮时，$_SESSION['cookieconsent'] 将总是被设置(因此 showCookie() 永远不会被调用)。

快速解决方案:

将 $_SESSION['cookieconsent'] = true; 移动到之后 echo "showCookie()";:

<?php
if(empty($_SESSION['cookieconsent'])) {
    echo "showCookie()";
    $_SESSION['cookieconsent'] = true;
}
?>