Question

我有一个列表ul（其ID为menu_），其中包含多个元素li，这些li最初位于班级in-active，我想要当客户端点击一个li重定向到另一个页面，然后将此li的CssClass更改为active。
我尝试过这个JS代码，但没有'工作后，客户点击li后它没有重定向到另一个页面（它保留在同一页面中）：

$(function () {
    $('#menu_ li').click(function () {
        $("li.active").removeClass("active");
        $(this).addClass("active");
        return false;
    });
});

Answer 1

您可以在每个页面内执行此操作。

$("li.active").removeClass("active");
$( "ul#menu li:nth-child(n)" ).addClass("active");

将此代码保留在准备好的事件中。

n是您要将类添加到的li的数量。

Answer 2

您正在混合服务器端/客户端功能。您的JS代码纯粹是客户端的，它将正确地切换类，但是return false;意味着不会遵循链接，因此不会执行重定向（不会运行服务器端代码）。

您可以删除return false;然后更改类和将执行重定向，但是一旦重定向完成，您将有一个新页面，类更改将不坚持。

你基本上有三个选择：

有一个JS代码，就像Imadoddin Ibn Alauddin在每个子页面中建议的那样，一旦页面加载，它将负责将导航中的正确元素设置为活动状态。
以某种方式在请求之间保持状态，一旦添加活动类，例如将状态保存在cookie或本地存储中。然后每次加载页面时，检查cookie /本地存储是否包含此类数据并相应地更新状态。
更改服务器端导航的状态，因此每次加载页面后，将活动类添加到相应的页面。

我建议选项3。

底线：你不能像现在这样混合。返回假;将取消重定向。执行重定向后，将加载一个新页面，导航将被重置，因此在重定向完成之前使用JS所做的任何更改都将消失。

如何在Asp.Net？

2 个答案: