我创建了 04 个按钮并为 CSS 中的每个按钮定义了活动状态。这些活动状态在 JS 中被调用，因此它会在单击时更改 div 样式属性，然后在单击另一个按钮时重置该属性。
但这对我不起作用。
我为此创建了一个小提琴DIV TAG。请帮忙。
问问题
807 次
1 回答
2
将您的代码从被调用更改onLoad为被调用No wrap - in <head>。
因为这些函数在 onLoad 函数范围内而不是全局范围内，所以它们不可读，并且在单击按钮时没有调用任何 javascript。
我没有更改任何代码，只是左侧窗格中的选项： jsFiddle
更新
您在逻辑上也有一个小缺陷，导致类交织在一起。这是你在做什么：
单击第一个对象时，将其类设置为 obj1_active。单击第二个对象时，将 obj1 的类设置为 obj2，并将 obj2 的类设置为 obj2_active。
如您所见，我们正在跨越 obj1 和 obj2 类。为了解决这个问题，我们将跟踪单击的最后一个对象 ( role) 以及单击新对象时它应该是的类 ( cname)。
这是演示：jsFiddle
优化
您拥有的代码有效，但不是很优化。我们不应该需要四个不同的函数，它们都对不同的元素做本质上相同的事情。
在这个演示中，我只是_active在单击时从每个元素的 className 中添加和删除：jsFiddle
让我们更进一步，使用多个类。这对于概括我们的 CSS 声明很有用。让我们使用默认类，并且仅将类附加active到活动元素上，并在单击新元素时将其删除。
我们还将_在 classNames 中分隔 ，以便它btn是它自己的类以及mission. 这使我们能够真正清理我们的 CSS 代码以提高可读性，并且当我们只需要简单的背景颜色更新或类似的东西时不需要更新多个部分。
这是优化的演示：jsFiddle
链接颜色
我不确定您是否打算这样做，但您会注意到链接有时会以白色开始，然后在单击时变为黑色。这是因为:link伪选择器只选择未访问的链接。如果您希望它选择所有链接，则只需使用<a>标签：Final jsFiddle
于 2013-05-23T05:18:58.833 回答