显示div onclick

Question

我在这里做错了什么..我试图在点击链接后通过js和css显示被调用的子div。 但它根本不会改变。

这是我的代码：

HTML：

<div id="container">

    <div id="sub1">content 1</div>
    <div id="sub2" class="hide">content 2</div>
    <div id="sub3" class="hide">content 3</div>

    <div id="navigation">
        <a href="#" class="mininav" onclick="switchContent('sub1'); return false;">link 1</a>
        <a href="#" class="mininav" onclick="switchContent('sub2'); return false;">link 2</a>
        <a href="#" class="mininav" onclick="switchContent('sub3'); return false;">link 3</a>
    </div>

</div>

JS：

function switchContent(obj) {

        obj = (!obj) ? 'sub1' : obj;

        var contentDivs = document.getElementById('container').getElementsByTagName('div');
        for (i=0; i<contentDivs.length; i++) {
            if (contentDivs[i].id && contentDivs[i].id.indexOf('sub') != -1) {
                contentDivs[i].className = 'hide';
            }
        }
        document.getElementById(obj).className = '';

    }

CSS：

.hide {
    display: none;
}

Answer 1

尝试将您的javascript代码放在之前的HTML代码中，以便html代码的onclick函数可以找到switchContent()函数。

Answer 2

为什么不使用Jquery？

$('subXX').hide();