单击按钮时出现的图像

Question

单击提交按钮时如何显示隐藏图像？

Answer 1

You were lucky I had a blank HTML page ready: 你很幸运我准备了一个空白的HTML页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type" /> 
    <meta charset="utf-8" />

    <title>Test</title>

    <style type="text/css">
      .hidden {
        display: none;
      }
    </style>
  </head>

  <body>
    <form>
      <input type="submit" id="submit" onclick="document.getElementById('hidden').style.display = 'block';" />
     </form>

     <img id="hidden" class="hidden" src="foo.png" />
  </body>
</html>

Answer 2

Using jQuery: 使用jQuery：

<img id="image1" src="myimage.jpg" style="display:none;" width="120" height="120"/>

<input type="submit" name="submit" value="submit" onclick"$('#image1').show()"/>

Answer 3

That would depend on how you are hiding it. 这取决于你如何隐藏它。 The easiest way to do it would be to change the class name of the image from one that makes it hidden to one that does not. 最简单的方法是将图像的类名从隐藏的图像更改为不隐藏图像的名称。

<img src="thesource" class="hidden">

document.getElementById("theid").className = ""; // remove the hidden class.


.classHidden {
     display: none;
}

Answer 4

document.getElementById("submitBtn").onclick = function() {
 document.getElementById("imageTag").style.display="block";
 return true;
}

Answer 5

Here's an example 这是一个例子

<img class="image_file src="image.jpg" />
<input type="submit" id="submit_button" name="submit_button" />

hide the image in css: 在css中隐藏图像：

.image_file
{
display:none;
}

with jquery: 用jquery：

$('#submit_button').click(function(
    $('.image_file').show();
));

and try to avoid inline javascript, it's messy and difficult to maintain when you have a big website. 并且尽量避免使用内联javascript，当你拥有一个大型网站时，它很难维护。

单击按钮时出现的图像

问题描述

5 个解决方案

解决方案1
5 2011-05-20 07:40:50

解决方案2
1 2011-05-20 07:43:18

解决方案3
0 2011-05-20 07:40:39

解决方案4
0 2011-05-20 07:41:44

解决方案5
0 2011-05-20 07:42:18

单击按钮时出现的图像

问题描述

5 个解决方案

解决方案1 5 2011-05-20 07:40:50

解决方案2 1 2011-05-20 07:43:18

解决方案3 0 2011-05-20 07:40:39

解决方案4 0 2011-05-20 07:41:44

解决方案5 0 2011-05-20 07:42:18

解决方案1
5 2011-05-20 07:40:50

解决方案2
1 2011-05-20 07:43:18

解决方案3
0 2011-05-20 07:40:39

解决方案4
0 2011-05-20 07:41:44

解决方案5
0 2011-05-20 07:42:18