仅将类添加到段落javascript中

时间:2013-04-22 14:49:18

标签: javascript html

我正在尝试使用javascript将一个类添加到段落中。但它只会将类传递给错误的id。我想更改<p id="para" class="para" >NAV One</p>的更改 但目前它只改变了列表的背景。 有什么想法吗?

function toggle_visibility(id) {
    var thelist = document.getElementsByClassName("alist");
    var para = document.getElementsByClassName("para");
    for (var i = 0; i < thelist.length; i++) {
        thelist[i].style.display = 'none';
    }
    var e = document.getElementById(id);
    var para = document.getElementById(id);
    if(e.style.display == 'block') {
        e.style.display = 'none';
    } else { 
        para.className += " " + 'active';
        e.style.display = 'block';
    }
}

的jsfiddle。 http://jsfiddle.net/FqqhY/4/

1 个答案:

答案 0 :(得分:1)

我认为你希望你的切换功能看起来更像这个

function toggle_visibility(hyp, id) {

    // hide all lists
    var allLists = document.getElementsByClassName('alist');
    for (var i = 0; i < allLists.length; i++)
        allLists[i].style.display = 'none';

    // deactive all paragraphs
    var allParas = document.getElementsByClassName('para');
    for (var i = 0; i < allParas.length; i++)
        allParas[i].className = 'para';

    // select the clicked hyper link and its child paragraph
    var list = document.getElementById(id),
        para = hyp.getElementsByClassName('para')[0];

    // activate the current para and show the list
    para.className = 'para active';
    list.style.display = 'block';
}

您还需要将this作为第一个参数传递给toggle函数以及相应的列表ID

<a href="#" onclick="toggle_visibility(this, 'list1');">

请参阅fiddle