1

我不知道是什么错误:

<script>
                function craft()
    {
    document.getElementById(craft).style.visibility="visible";
    document.getElementById(smell).style.visibility="hidden";
    document.getElementById(other).style.visibility="hidden";
    }

function smell()
{
document.getElementById(craft).style.visibility="hidden";
document.getElementById(smell).style.visibility="visible";
document.getElementById(other).style.visibility="hidden";
}

function other()
{
document.getElementById(craft).style.visibility="hidden";
document.getElementById(smell).style.visibility="hidden";
document.getElementById(other).style.visibility="visible";
}
        </script>



    <a onclick ="craft()" href="#">Craft</a><br>
    <a onclick ="smell()" href="#">Smell</a><br>
    <a onclick ="other()" href="#">Other</a><br>
    <div id="craft" style="display: none;" >CraftCraftCraftCraftCraftCraftCraft</div><br>
      <div id="smell" style="display: none;" >SmellSmellSmellSmellSmellSmellSmell</div><br>
        <div id="other" style="display: none;" >OtherOtherOtherOtherOtherOtherOther</div><br>

我试图做一些像菜单一样的想法。当我点击工艺按钮时,只会出现包含

我找不到错误...我在浏览器中尝试了代码,但是出现了链接...当我单击它们时,没有任何反应...

4

1 回答 1

5

'在 中的 ID 周围使用document.getElementById()。例如:

document.getElementById('craft').style.visibility="visible";

没有它们,JavaScript 将尝试解释craft为变量(保存 ID 的值),而不是表示实际 ID 的字符串。

编辑

再看一遍后,您不使用一致的属性来隐藏您<div>的 s:

一开始你用 隐藏它们,display: none;然后尝试用 显示它们visibility: visible;。你必须在这里保持一致。使用displayvisibility。两者在实际工作上有所不同。

所以要么调整你的 JavaScript 以display像这样使用:

document.getElementById('craft').style.display = "block";

或者最初使用visibility: hidden;这样的禁用:

<div id="craft" style="visibility: hidden;" >CraftCraftCraftCraftCraftCraftCraft</div>

工作示例小提琴

于 2013-02-24T18:07:17.200 回答