Js和Divs，(甚至<div>也不同)

Question

我已经找到了一个javascript代码，它非常适合显示DIV。但是，这段代码只用于显示每个页面的一个div。我想包括许多DIVS的隐藏和显示在同一页。

我试图将div id和show/隐藏span id替换为每个包含的rundom php编号，但仍然无法工作。

那我该怎么做？

JS代码：

var done = true,
    fading_div = document.getElementById('fading_div'),
    fade_in_button = document.getElementById('fade_in'),
    fade_out_button = document.getElementById('fade_out');

function function_opacity(opacity_value) {
    fading_div.style.opacity = opacity_value / 100;
    fading_div.style.filter = 'alpha(opacity=' + opacity_value + ')';
}

function function_fade_out(opacity_value) {
    function_opacity(opacity_value);
    if (opacity_value == 1) {
        fading_div.style.display = 'none';
        done = true;
    }
}

function function_fade_in(opacity_value) {
    function_opacity(opacity_value);
    if (opacity_value == 1) {
        fading_div.style.display = 'block';
    }
    if (opacity_value == 100) {
        done = true;
    }
}
// fade in button
fade_in_button.onclick = function () {
    if (done && fading_div.style.opacity !== '1') {
        done = false;
        for (var i = 1; i <= 100; i++) {
            setTimeout((function (x) {
                return function () {
                    function_fade_in(x)
                };
            })(i), i * 10);
        }
    }
};
// fade out button
fade_out_button.onclick = function () {
    if (done && fading_div.style.opacity !== '0') {
        done = false;
        for (var i = 1; i <= 100; i++) {
            setTimeout((function (x) {
                return function () {
                    function_fade_out(x)
                };
            })(100 - i), i * 10);
        }
    }
};

Answer 1

查看小提琴，您可以根据需要编辑代码;)

$(function() {
   $('.sub-nav li a').each(function() {
    $(this).click(function() {
       var category = $(this).data('cat');
       $('.'+category).addClass('active').siblings('div').removeClass('active');
    });
  });
});

Answer 2

最后我找到了我自己：

<a class="showhide">AAA</a>
<div>show me / hide me</div>
<a class="showhide">BBB</a>
<div>show me / hide me</div>

js

$('.showhide').click(function(e) {
    $(this).next().slideToggle();
    e.preventDefault(); // Stop navigation
});
$('div').hide();

我只是在发这篇文章以防有人想要回答。