Question

当链接没有指向任何地方（href =“＃”）时，我的toggleClass就像它想象的那样工作。但是只要我用URL填写“href”它就不再起作用了。我怀疑是因为页面刷新了？但我对JS很新。如果这是问题，我该如何解决它？如果不是，那我做错了什么？

所以这是我当前使用jquery的javascript：

$(document).ready(function()
{
    $('.button').click(function()
    { 
        $('.buttonselected').removeClass('buttonselected');
        $(this).toggleClass('buttonselected'); 
    }); 
});

这是我的HTML代码：

<nav>
    <ul>
        <li> 
            <a class="button" href="?page=frontpage"> HOME </a> 
        </li>
    </ul>
</nav>

列表中有更多链接，但这与此问题无关。
是的，我正在使用PHP include。
此外，如何在页面加载时设置指向“toggleClass”的链接，以便在有人第一次进入网站时获取该类。
感谢您的帮助！

Answer 1

你是对的。该课程因为页面重新加载而消失。如果您在页面加载时需要特定的链接来获取特定的类，则需要对该链接进行硬编码。手动将类放在与php的链接上，或者以其他方式区分它，以便JavaScript可以找到它。

如果根据您之前点击的链接，应该拥有该类的链接不同，则必须使用Cookie或localStorage object来保留该信息。

更好的是，您应该尝试找出一种方法来传递这些信息，而不涉及重新加载页面。这是理想的，因为在大多数情况下，用户不希望在他们没有预期的情况下重新加载页面。

编辑：

如果您不需要使用查询字符串变量，@ pszaba的答案很棒。

Answer 2

您可以使用event.preventDefault（）

$('.button').click(function( event )
{ 
    event.preventDefault(); // default action of the event will not be triggered.

    $('.buttonselected').removeClass('buttonselected');
    $(this).toggleClass('buttonselected'); 
});

修改

如果您要加载首页（如在链接中）并为其指定“按钮选择”类比你需要使用PHP。

像这样的东西

if( isset($_POST['page']) ){ $selectedPage = $_POST['page']; }

查看

<a class="button <?php echo ($selectedPage=='frontpage')?' buttonselected':'' ?>" href="?page=frontpage"> HOME </a>

单击链接或刷新页面后，Jquery toggleClass将丢失该类

2 个答案: