宛先がonClickイベントで機能する関数があります。
たとえば、4 つの Span 要素と 4 つの Div 要素があります。スパンは、これらの Div を「開きたい」タブ ボタンです。
最初のスパン onClick は、「ブロック」の最初の Div の style.display を「none」から (open) 変更し、次のスパンについても同様に変更します。
このコードは非常にうまく機能しますが、要素のデザインのみが変更されます。
function activateSup(s) {
var workTable = s.parentNode.parentNode.parentNode.parentNode.parentNode;
var spans = workTable.getElementsByTagName("span");
var supDivs = workTable.getElementsByClassName("supDiv");
for (var i = 0; i < spans.length; i++) {
spans[i].style.backgroundColor = "";
spans[i].style.border = "";
}
s.style.backgroundColor = "#5eac58";
s.style.border = "2px solid #336633";
}
以下のコードを関数に追加して、目的を達成しようとしましたが、機能しません。
var getIndex = function(s) {
for (var index = 0; s != s.parentNode.childNodes[index]; index++);
return index;
}
for (var d = 0; d < supDivs.length; d++) {
if (getIndex == d) {
supDivs[d].style.display = "block";
}
else {
supDivs[d].style.display = "none";
}
}