如何通过更改菜单上的图像来突出显示当前页面？

Question

这是我的div导航中的一行：

<a href="/Home/ShoppingCart"><img class="swap5" src="/Static/Images/Meny_normal_06.png"  alt="" /></a>

当有人点击此图片时，他们会被重定向到另一个页面，我希望这张图片交换到我的另一张更暗的图像，突出显示当前页面。

到

＆lt; ---突出显示我要更改为当前页面的内容

这是我的Jquery：

<script type="text/javascript">
        $(document).ready(function () {
            $('.swap5').click(function () {
                $(this).attr('src', '/Static/Images/Meny_clicked_01.png');


         });  
        });
</script

＆GT;

我意识到这不会这样做，因为当我被重定向到另一页时，新图像已经消失了。

我怎样才能顺利完成这项工作？我正在使用MVC 3 btw

感谢任何形式的帮助

Answer 1

您可以使用普通的JavaScript来实现这一目标。给image元素一个id，让我们说“我”。 做点什么 document.getELmentById（“me”）。setAttribute（“src”，“link to your other image”）;

Answer 2

在这种情况下你可以使用cookie。只要点击按钮，你就可以将这些信息存储在cookie中。

在下一页中检查cookie，如果存储了您期望的值，则替换重定向页面上的新图像。

Answer 3

如果要在重定向到的视图上运行此项而不是从重定向的页面？

<script type="text/javascript">
    $(document).ready(function () {
        $('.swap5').attr('src', '/Static/Images/Meny_clicked_01.png');
    });
</script>

Answer 4

忘记jquery，我可以使用css。

在当前页面上使用.active课程。

例如： -

1. 定义一个类

   。主动{背景：网址（/image/activemenu.jpg）;}

2. 使用当前页面上的类突出显示导航。

   利＆GT;类= “活性” ＆GT; a href =“＃”＆gt; ORDER / a＆gt; /立GT;