首次加載后從導航中刪除課程

Question

我有一個基於單個頁面頂部的網站，可以動態更改其內容。 內容的容器是一個帶有一些javascript和css動畫的div（我給我的nav一個“動畫”的類），並且我想在第一次之后刪除該類（這樣就不再制作動畫了）。

有什么辦法可以刪除（在第一頁加載后）或添加（在第一頁加載期間）此類？ 我已經嘗試過使用標准查詢代碼，但是當我單擊更改div容器內容的鏈接時，所有動畫均重新啟動。 這是我的html：

<nav class="main animated fadeInRight"><?php include('template/nav/main.php'); ?></nav>

我想用類似的方法刪除動畫類，但是對於每個新頁面加載。

<script type="text/javascript">
    $(document).ready(function() {
        $('nav').removeClass("animated");
    });
</script>

這是行不通的，因為當我單擊鏈接更改內容時，它還會重新加載頁面並重新啟動所有動畫。

非常感謝！

Answer 1

如果不查看所有代碼，很難說，但是我可能會將URL參數放在導航鏈接的末尾。 您提到單擊鏈接更改內容也會重新加載頁面，對嗎？

好吧，在導航中的所有鏈接上，輸入一個像這樣的參數：

<a href="pageName.php?firstLoad=N">Page Name</a>

然后，在所有頁面的頂部，其中包含導航：

<?php 
    if($_GET["firstLoad"] == "N") {  
        echo '<nav class="main fadeInRight">';
        include('template/nav/main.php');
        echo '</nav>';
    } 
    else {
        echo '<nav class="main animated fadeInRight">';
        include('template/nav/main.php');
        echo '</nav>';
    }
?>

Answer 2

您缺少的一對”

<script type="text/javascript">
    $(document).ready(function() {
        $('nav').removeClass("animated");
    });
</script>

甚至精確

<script type="text/javascript">
    $(document).ready(function() {
        $('nav[class="main"]').removeClass("animated");
    });
</script>

Answer 3

您應該在導航欄上加上引號，例如

$（ “NAV”）

否則，它指向一個不存在的變量

Answer 4

每次重新加載頁面都會完全重新啟動您的應用程序。

如果您希望在頁面刷新后阻止動畫播放，

您可以在字符串中添加參數-即/？animation = true

並在您的PHP文件中查找

<nav class="main <?php if($_GET['animation'] == true) {echo animated." ";} ?> fadeInRight"><?php include('template/nav/main.php'); ?></nav>

然后將其刪除所有其他鏈接。

除非我沒有正確處理，否則在這種情況下，只需在提供的腳本中修正您的錯別字即可：

$().ready(function() {
    $("nav").removeClass("animated");
});

Answer 5

您可以使用網絡存儲。

頁面首次加載時，您將從導航中刪除該類，然后再進行一些檢查是否已刪除該類。

頁面加載后，您可以執行以下操作：

<script>
    if(localStorage.getItem("ClassRemoved") !== "true") {
         // remove the class
         localStorage.setItem("ClassRemoved", "true");
    }
</script>

Answer 6

有許多解決方案，因為這有可能。 但是此鏈接可能會幫助您創建cookie，並且根據其生存時間，您可能希望不進行動畫處理。