Javascript在点击时改变颜色并保持相同的颜色答案

【问题标题】：Javascript change color on click and keep the same colorJavascript在点击时改变颜色并保持相同的颜色
【发布时间】：2012-02-13 22:21:17
【问题描述】：

我目前有以下代码：

<li><a href="index.php" id="1" onclick="document.getElementById('1').style.background = '#8B4513';">Weblog</a></li>

这会改变颜色，但是因为它打开了 index.php，所以颜色不会保持不变。它恢复到原来的颜色。

如何在不同的页面中保持相同的颜色？

谢谢

【问题讨论】：

您指的是访问过的链接的颜色吗？
简单的解决方案是使用 cookie 来跟踪此类选择。在加载新页面时，您可以检查标志并设置颜色。
如果我点击另一个链接，我点击的上一个链接会变回原来的颜色吗？还是保留它的“点击”颜色？因为 visited links 和 selected links 有不同的实现和效果 - 你的问题听起来有点两者兼而有之。

【解决方案1】：

首先，ID 不能以数字开头。

您必须在服务器端捕获选定的页面并给它一个类似于 selected 的类并使用 CSS 来执行以下操作：

li.selected a
{
    background: #8B4513;
}

如果您不知道如何使用 PHP 设置选定页面，请阅读这篇文章：http://darkstar-media.blogspot.com/2009/04/css-page-selected-with-php.html

【讨论】：

【解决方案2】：

从提供的代码看来，一旦用户点击了链接，您就会尝试设置元素的样式。

这里似乎不需要 Javascript。我只会使用 :visited css 伪类来设置元素的样式。

例如；

a:visited { text-decoration: line-through; }

【讨论】：

【解决方案3】：

Javascript 是客户端，这意味着所做的任何更改都会以某种方式发生在用户的屏幕上。

PHP 是服务器端。您向服务器发送请求，它会处理请求并显示输出。

如果要突出显示当前网页，这不是办法。

我建议您在li a-list 中的每个文件上添加一行PHP。例如：

<?php if ($URL == 'index.php') echo 'class="selected"'; ?>

并使用 CSS 与选定的红色类建立链接。

【讨论】：