JavaScript/PHP 刷新替换 HTML 元素类答案

【问题标题】：JavaScript/PHP Refresh Replace HTML Element ClassJavaScript/PHP 刷新替换 HTML 元素类
【发布时间】：2015-03-11 23:07:21
【问题描述】：

我的网站上有一个模板元素，它是用 PHP 创建的。它出现在我网站的许多页面上。模板中有一个span，其类为hidden。当单击元素中的button 时，它会从span 中删除hidden 类。它在第一页上效果很好，但问题是一旦从span 中删除该类，它就会遍及具有该模板的所有页面。有没有办法在页面刷新时替换隐藏类？

这是一个 WordPress 网站，我可以提供任何相关的代码 sn-ps。 javascript很简单，就是一个jQuery点击触发按钮，去掉隐藏类，页面标记很简单。

以下是 PHP 模板部分的要点：

https://gist.github.com/weaverhe/7d8dec4a522a12478289 （此代码只是简单地包含在 PHP 的相应模板文件中）

还有 javascript：

相关片段：

// Show the filter bar on button click

function showFilters() {
  $('#toggle-filters').on('click', function(e) {
    if($('div.filters').hasClass('hidden')) {
        e.preventDefault();
        $('div.filters').removeClass('hidden');
        $(this).removeClass('grey').text('Apply Filters');
        $('#remove-filters').removeClass('hidden');
        $('#chosen-tag-holder span.active').removeClass('hidden');
    }
    else {
        return true;
    }
  });
}

删除隐藏类的#chosen-tag-holder选择器应该在页面重置时重置。

全过滤栏JS： https://gist.github.com/weaverhe/05e05e45dbbcc9f10f47

allFilters(); 函数在document.ready 的每个页面上运行

【问题讨论】：

应该很容易发现问题。发布相关的html和js虽然

标签： javascript php jquery

【解决方案1】：

刷新应该清除 javascript 更改，听起来您的问题在其他地方。需要查看 javascript sn-p 才能了解您在做什么。

否则建议检查您是否已清除浏览器缓存，并且在测试时禁用任何 wordpress 缓存。

当您在页面之间导航时，是否正在重新加载父窗口？如果您有多个窗口对象，则可能是您的问题。

【讨论】：

感谢您的建议！我很确定这不是缓存问题，因为我在暂存环境中工作。我已经在上面发布了相关代码，但我不确定父窗口。我该如何检查呢？

【解决方案2】：

如果我理解正确，您希望在单击元素中的按钮后在所有页面上永久删除隐藏类，无论用户是刷新页面还是选择网站上的另一个页面？没有办法在客户端用 Javascript 实现这个，你需要修改你的 php 代码。

根据您是希望在以后的所有会话中删除隐藏类还是仅针对该特定用户在本次会话中删除隐藏类，您需要执行以下操作之一：

1) 在会话的剩余部分中删除。设置 $_SESSION 超全局变量，并在该用户每次刷新/更改页面时读取其值并相应地回显相应的 html。

另见：

http://php.net/manual/en/reserved.variables.session.php

Session lost after page redirect in php

2) 为该特定用户永久删除。在您的用户数据库中保存一个布尔值 (tinyInt)，在应用模板之前读取该值，指示该用户是否（曾经）单击过该按钮，然后呈现相应的 html。

在任何情况下，您都需要像这样修改您的模板：

<?php
    "your condition" ? 
    echo <div class="hidden filters row overflow-visible"> :
    echo <div class="filters row overflow-visible">;
?>

【讨论】：