使用Javascript更改类，默认设置一个元素的类相反

首先，我意识到我的问题可能与其他一些帖子相对相似，但是，我尝试从其他帖子实施代码，但无法让它按照方式工作我想了。我对JavaScript很新，所以请耐心等待。使用Javascript更改类，默认设置一个元素的类相反

我有单独的div元素中的链接选择看起来像标签。每次我点击不同的链接时，活动链接的背景颜色会从灰色变为白色，而以前活动链接的背景颜色会从白色变为灰色。

这是我的难题：我需要Home链接的默认设置，以便在页面加载时具有白色背景。

下面的代码：

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>

谢谢你在前进，如果你能帮助！

来源

2012-05-29 patwick600akabob

这就是我，还是你忘了在最后问你的问题......？ – gdoron

下面是我的难题：我需要Home链接的默认设置，以便在页面加载时具有白色背景。这是我的问题。 – patwick600akabob

更改初始类为'active'为家庭链接...？

来源

2012-05-29 17:18:18 Mathletics

当我将Home链接设置为活动状态时，它会将背景颜色永久显示为白色。 – patwick600akabob

开始'selected'作为您的主页选项卡而不是null。对于记录来说，这看起来像一个可怕的方式来做标签。你不应该在你的HTML中有任何JS，你不应该在JS中管理状态，特别是如果你使用类标记的话。 – Mathletics

我会如何执行此操作？ – patwick600akabob

类主动加入到其链接的主页（在设计时）在div

<div class="none active" id="t6"><a class="menu" href="#6" onload="toggleClass(t6)" onclick="toggleClass(t6)" target="tabs">Home</a></div>

但是，你仍然必须编写逻辑在JavaScript中移除上课的时候其他一些选项卡被选中并将active类添加到选定的选项卡。

来源

2012-05-29 17:27:00 Wiz

我刚刚意识到我在代码中留下了onload，我的想法是当页面加载时它会将类更改为活动状态。有什么办法可以实现这个吗？我只是尝试了你所说的话，但它只是将Home链接背景颜色永久保留为白色。 – patwick600akabob

使用Javascript更改类，默认设置一个元素的类相反

回答

相关问题