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

Question

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

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

当有人单击此图像时，他们将被重定向到另一个页面，我希望此图像交换到我的另一个较暗的图像，从而突出显示当前页面。

至

<--- 突出显示我要更改的当前页面

这是我的jQuery：

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


         });  
        });
</script

>

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

我怎样才能顺利地做到这一点？我正在使用 MVC 3 顺便说一句

任何形式的帮助表示赞赏

Answer 1

忘记 jquery，我可以使用 css 来完成。

.active在当前页面上使用一个类。

前任：-

1. 定义一个类

   .active{background:url(/image/activemenu.jpg);}

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

   li> class="active"> a href="#"> ORDER /a> /li>

Answer 2

您可以使用纯 javascript 来实现这一点。给图像元素一个 id，比如说“我”。做类似 document.getELmentById("me").setAttribute("src", "link to your other image"); 这

Answer 3

在这种情况下，您可以使用 cookie。单击按钮后，您可以将该信息存储在 cookie 中。

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

Answer 4

在您重定向到的视图而不是您重定向的页面上运行它怎么样？

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