彈出框javascript+PHP代碼混合不起作用？

Question

我正在做一個大型項目，其中包括一個帶有 cookie 信息的彈出框，該框只會在會話中第一次打開，但在 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;
}
?>