首先,我意识到我的问题可能与其他一些帖子比较相似,但是,我尝试从其他帖子中实现代码,但无法让它按照我想要的方式工作。我对 Javascript 很陌生,所以请多多包涵。
我在单独的 div 元素中选择了一些链接,看起来像标签。每次我点击不同的链接时,活动链接的背景颜色都会从灰色变为白色,而之前活动链接的背景颜色也会从白色变为灰色。
这是我的难题:我想要主页链接的默认设置,以便在页面加载时它具有白色背景。
这是代码:
div.none {
background-color: #cccccc;
border-radius: 10px 10px 0px 0px;
float: right;
padding: 5px 15px 3px 15px;
}
div.active {
background-color: white;
border-radius: 10px 10px 0px 0px;
float: right;
padding: 5px 15px 3px 15px;
}
...
<script type="text/javascript">
var selected = null;
function toggleClass(x) {
if (selected != null)
selected.className = 'none';
selected = x;
x.className = 'active';
}
</script>
...
<div class="none" id="t1"><a class="menu" href="#1.html" onclick="toggleClass(t1)" target="tabs">Book Online</a></div>
<div class="none" id="t2"><a class="menu" href="#2.html" onclick="toggleClass(t2)" target="tabs"> Contact</a></div>
<div class="none" id="t3"><a class="menu" href="#3" onclick="toggleClass(t3)" target="tabs">News</a></div>
<div class="none" id="t4"><a class="menu" href="#4" onclick="toggleClass(t4)" target="tabs"> Mobile Recording</a></div>
<div class="none" id="t5"><a class="menu" href="#5" onclick="toggleClass(t5)" target="tabs"> Recording Studios</a></div>
<div class="none" id="t6"><a class="menu" href="#6" onload="toggleClass(t6)" onclick="toggleClass(t6)" target="tabs">Home</a></div>
如果您能提供帮助,请提前感谢您!