1

我在这里做错了什么..单击链接后，我试图通过 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;
}
4

2 回答 2

1

尝试将您的javascript代码放在您的html代码之前，以便onclick您的html代码的功能可以找到该switchContent()功能。

于 2012-09-16T12:08:16.300 回答
0

为什么不使用 Jquery？

$('subXX').hide();
于 2012-09-16T12:04:53.463 回答