2

このようなことをするとうまくいくと思いましたが、スタイルが最初から画像を隠しているのに、ボタンが押されたときに表示されないのはなぜではないのか混乱しています。コードは次のとおりです。

function showImg() {
    x=document.getElementById("map_img")
    x.style.visibility="visible";
}

<body>
    <img id="map_img" src="map.jpg" style="visibility:hidden" width="400" height="400"/>

    <form id="form1" name="form1" align="center">
        <input type="submit" id="Map" value="Map" onclick="showImg()"/>
    </form>

私も両方の状況でこれを試しました：

<input type=button id="Map" value="Map" onclick="showImg()"/>

と：

<style>
    .hidden{display:none;}
    .show{display:block;}
</style>

function showImg() {
    x=document.getElementById("map_img")
    x.class="show";
}

<body>
    <img id="map_img" src="map.jpg" class="hide" width="400" height="400"/>

    <form id="form1" name="form1" align="center">
        <input type="submit" id="Map" value="Map" onclick="showImg()"/>
    </form>

これらのどちらもどのように機能しなかったのか、私は本当に迷っています。これについて何か助けてもらえますか?

4

3 に答える 3

1

標準の送信動作が必要ない場合は、input要素を a でラップしないでください。form

記述されているコードでは、 によってformページの読み込みまたはエラーがトリガーされ、スクリプトの実行が妨げられます。

于 2013-05-18T13:01:19.100 に答える
1

どちらの例でもフォームは必要ありません。

JavaScript は<script>ブロック内にある必要があり、いくつかの構文エラーがあります。

試す

<head>
    <script>
        function showImg() {
            document.getElementById("map_img").style.display = "";
        }
    </script>
</head>
<body>
    <img id="map_img" src="map.jpg" style="display: none;" width="400" height="400"/>
    <input type="submit" id="Map" value="Map" onclick="showImg()"/>
</body>
于 2013-05-18T13:12:13.787 に答える
-1

DougM は正しい (+1)

さらに、それはshowImg = function()

ここにデモがあります：http://jsfiddle.net/Uppt6/

于 2013-05-18T13:05:33.507 に答える