Question

JS代码：

var $ = function (id) {
return document.getElementById(id);
};
var faqs = $("faqs");
var h2Elements = faqs.getElementsByTagName("h2");

var h2Node;
for (var i = 0; i < h2Elements.length; i++) {
    h2Node = h2Elements[i];


}
$("first_link").focus();
$(document).ready(function () {
    $("h2").click(function () {
        if (h2.hasAttribute("class")) {
            h2.removeAttribute("class");
        } else {
            h2.setAttribute("class", "minus");
        }
        if (h2.nextElementSibling.hasAttribute("class")) {
            h2.nextElementSibling.removeAttribute("class");
        } else {
            h2.nextElementSibling.hide();
        }
    });
});

点击问题后，应显示该答案。当我点击其他问题时，所有其他答案都应缩回（隐藏）。我调整了几次，代码不会隐藏任何东西（所有答案仍然打开）或者所有答案都不会打开。

从$（document）.ready（function（）{开始，如何在点击时一次打开一个问题（关闭其他人）？

非常感谢任何输入！

Answer 1

创建一个函数来隐藏具有类名div的所有其他open，例如：

function hideOthers() {
    var othersDivEle = document.getElementsByClassName("open");
    for(var d = 0; d < othersDivEle.length; d++) {
        othersDivEle[d].removeAttribute("class");
    }
}

并在以下位置更改您的代码：

...
} else {
   hideOthers();
   h2.nextElementSibling.setAttribute("class", "open");
}

到

..
} else {
    hideOthers();            
    h2.nextElementSibling.setAttribute("class", "open");
}

更新了jsFiddle

JS - 一次显示一个FAQ，隐藏其他人

1 个答案: