javascript - 导航工作一次，但之后什么都不做

Question

我正在尝试编写一个包含四个元素的导航栏。如果该元素当前被选中，它将有一个“红色”背景图像，如果它是其他 3 个元素之一，它将有一个“黑色”背景图像。我的四个标签是“时间表、家庭作业、通知和运动” 我尝试制作 8 个函数，如下面的 2 个

function setTimeRed() 
{
    document.getElementById("time").style.ClassName = 'timetable_r';
}

function setTimeBlack() 
{
    document.getElementById("time").style.ClassName = 'time_r';
}

然后像这样的四个 block :

function changeTimeButton()
{
    var timePath = new String();
    timePath = document.getElementById("timetable").style.backgroundImage;

    if(timePath == "url(assets/img/tabs/time_black.png)" || timePath == "")
    {
        setTimeRed();
        setHomeBlack();
        setNotiBlack();
        setSportBlack();
    }
    else {

    }  
}

最后，我的 html 有这个:

<div id="tabbar">
            <ul id="tabs">

                <a href"#" onclick="changeTimeButton()">
                    <li id="timetable" class="time_b">
                        <p>Timetable</p>
                    </li>
                </a>

                <a href"#" onclick="changeHomeButton()">
                    <li id="homework" class="home_b">
                        <p>Homework</p>
                    </li>
                </a>

                <a href"#" onclick="changeNotiButton()">
                    <li id="notifications" class="noti_b">
                        <p>Notifications</p>
                    </li>
                </a>

                <a href"#" onclick="changeSportButton()">
                    <li id="sport"  class="sport_b">
                        <p>Sport</p>
                    </li>
                </a>

            </ul>

        </div>

它工作一次然后什么都不做。为什么？

Answer 1

我认为你的脚本有错误，只是一个例子

document.getElementById("time").style.ClassName = 'timetable_r';

这应该是(至少在您发布的代码中，您的 html 中没有 id 为“time”的元素)

document.getElementById("timetable").style.ClassName = 'timetable_r';

另一件事，如果它工作一次，那么它似乎可以解决新 session 或现有 session 的一些问题。我不是 JavaScript 专家。但如果有帮助，请告知。