Question

我正在制作一个讲座的网站。讲座分为几章。每章都有它自己的链接，当点击一个新视频加载一个外部html get加载到文本窗口。我需要这些链接保持活跃，以便人们知道他们在哪一章。

这是我目前的html：

<li><a href="#" onclick="javascript:loadContent('#pres', chapter1.html');changeVideo('chapter1')">chapter1</a></li>
<li><a href="#" onclick="javascript:loadContent('#pres', 'chapter2.html');changeVideo('chapter2')">chapter2</a></li>

..等等..

现在，这完全正常工作..正如我所说，我需要链接保持活动状态，并尝试添加addClass（this）即：

onclick="javascript:loadContent('#pres','chapter2.html');changeVideo('chapter2');addClass(this)">... 

function addClass(obj)
{
  obj.className="active";
}

这不起作用。我也尝试删除除了addClass函数之外的所有东西，但没有运气。

有什么想法吗？

Answer 1

function clickChapter(type, page, chapter){
    loadContent(type, page);
    changeVideo(chapter);
    removeAllClass();
    addClass(ocument.getElementById('id_'+chapter));
}

function removeAllClass(){
    var aAnchor = document.getElementsByTagName('A');
    for(var i=0; i<aAnchor.length;  i++){
        aAnchor[i].className = '';
    }
}

<li><a href="#" id="id_chapter1" onclick="clickChapter('#pres', 'chapter1.html', 'chapter1')">chapter1</a></li>
<li><a href="#" id="id_chapter2" onclick="clickChapter('#pres', 'chapter2.html', 'chapter2')">chapter2</a></li>

Answer 2

你可以试试这个......

首先创建一个Cascaded样式表（CSS），并在其中编写如下代码：

a:active {
    color: #006600;
    font: 12px Verdana, Arial, Helvetica, San-serif;
    text-decoration: none;
}

或

a:visited {
    color: #006600;
    font: 12px Verdana, Arial, Helvetica, San-serif;
    text-decoration: none;
}

或

a:link {
    color: #006600;
    font: 12px Verdana, Arial, Helvetica, San-serif;
    text-decoration: none;
}

然后将此代码粘贴到您的html页面的头部：

 <link type="text/css" href="<Path of the CSS>.css" rel="stylesheet"/>

如何获取保持活动的链接？

2 个答案: