小编Shi*_*min的帖子

我的功能:

function ChangeStep(id)
{
    var i = 1;

    // hide all other tabs:
    while(i<10) {
        var divID = 'tabs' + i;
        if (divID !== null) {
            document.getElementById(divID).className += " hide";
        }
        i++;
    }

    // show this one
    document.getElementById(id).className += " show";
}

我怎么称呼它:

<div id="prev"><img src="img/prv.png" onClick="ChangeStep('tabs1'); return false;"></div>
<div id="next"><img src="img/nxt.png" onClick="ChangeStep('tabs2'); return false;"></div>

我要显示/隐藏的Div:

<div id="tabs1" class="hide"><h1>Step 1</h1></div>
<div id="tabs2" class="show"><h1>Step 2</h1></div>

我的Css:

.hide { visibility: hidden; }
.show { visibility: visible; }

基本上我想要做的是:当我单击"下一个"或"上一个"时,通过隐藏所有其他人并显示此对话来显示相应的"选项卡".这应该通过添加类"隐藏"或"显示"来完成,具体取决于它是隐藏还是可见.

Javascript显示/隐藏标签和iFrame的功能:

function ChangeStep(id)
{
    var i = 1;
    // hide all other tabs:
    while(i<3) {
        var divID = 'tabs' + i;
        if (divID !== null) {
            document.getElementById(divID).className = " hide";
        }
        i++;
    }

    // show this one
    document.getElementById(id).className = " show";
}

if (id == "tab2") {
    document.getElementById(iFrame).className = " iFrame2";
}
else if (id == "tab1") {
    document.getElementById(iFrame).className = " iFrame1";
}

选项卡的更改有效,但底部的if语句似乎不起作用.

编辑

问题是我有一个ID为的iFrame 'iFrame'.现在我在css文件中创建了两个名为:的类'iFrame1','iFrame2'它们具有不同的设置,使iFrame看起来不同.上面的函数在更改'tabs'(将"显示"类添加到一个而将"隐藏"添加到所有其他类型)时没有问题.但它似乎没有改变iFrames类,'iFrame2' and/or 'iFrame1' 我不能把它放在JSFiddle上,因为我的网站很大程度上依赖于图像,所以我只是将你链接到我上传的地方: …