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;ます。ここでは一貫している必要があります。displayまたはを使用しますvisibility。どちらも実際の動作が異なります。

displayしたがって、次のように使用するようにJavaScriptを調整します。

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

または、次のように使用して最初に無効にしvisibility: hidden;ます。

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

実例フィドル

于 2013-02-24T18:07:17.200 に答える