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 回答