Fatal编程技术网
  • javascript/
  • Javascript 当我按下指定图像的按钮时，如何使图像不可见但显示？

Javascript 当我按下指定图像的按钮时，如何使图像不可见但显示？

javascript html css

Javascript 当我按下指定图像的按钮时，如何使图像不可见但显示？,javascript,html,css,visibility,Javascript,Html,Css,Visibility,我试图创建一个JavaScript可见性函数，当我按下图像按钮时，它就会出现。不过，图像并未显示。我有隐藏的图像，因为我只希望他们显示时，按下按钮。我能做些什么来解决这个问题 <html> <head> <style type="text/css"> #xbone { position:absolute; margin-left: auto; margin-right: auto; visibility: hidden; } #

我试图创建一个JavaScript可见性函数，当我按下图像按钮时，它就会出现。不过，图像并未显示。我有隐藏的图像，因为我只希望他们显示时，按下按钮。我能做些什么来解决这个问题

<html>
<head>
<style type="text/css">
#xbone {
    position:absolute;
    margin-left: auto;
    margin-right: auto;
    visibility: hidden;
}
#ps4 {
    position:absolute;
    margin-left: auto;
    margin-right: auto;
    visibility: hidden;
}
#wiiu {
    position:absolute;
    margin-left: auto;
    margin-right: auto;
    visibility: hidden;
}
</style>
<script type="text/javascript">
function xbox()
    {
        document.getElementById("xbone").style.visibility="visible";
    }
    funtion sony()
     {
        document.getElementById("xps4").style.visibility="visible";
    }
    funtion nintentdo()
     {
        ddocument.getElementById("wiiu").style.visibility="visible";
    }
</script>
<img id="xbone" src="http://assets1.ignimgs.com/vid/thumbnails/user/2013/06/19/XboxOne1.jpg" alt="Xbox One" width="800" height="600">
<img id="ps4" src="http://gamingbolt.com/wp-content/uploads/2013/06/ps4-hd-wallpapers.jpg" alt="Playstation 4" width="800" height="600">
<img id="wiiu" src="http://www.digitaltrends.com/wp-content/uploads/2012/09/Wii-U.jpg" alt="Wii U" width="800" height="600">
<input type="button" value="XBox One" onclick="xbox()">
    <input type="button" value="Playstation 4" onclick="sony()">
        <input type="button" value="WII U" onclick="nintendo()">
</head>
<body>

</body>
</html>


#xbone{
位置：绝对位置；
左边距：自动；
右边距：自动；
可见性：隐藏；
}
#ps4{
位置：绝对位置；
左边距：自动；
右边距：自动；
可见性：隐藏；
}
#威尤{
位置：绝对位置；
左边距：自动；
右边距：自动；
可见性：隐藏；
}
函数xbox（）
{
document.getElementById（“xbone”）.style.visibility=“visible”；
}
索尼功能
{
document.getElementById（“xps4”）.style.visibility=“visible”；
}
第九项职能（）
{
ddocument.getElementById（“wiiu”）.style.visibility=“visible”；
}
只是一个想法。。。使用RGB（lsb）等隐写术方法，将一张图片隐藏在另一张图片中。无论何时按下按钮，隐写术反向工作并显示隐藏的图片。我在python中使用了stepic，工作得很好。对java一无所知。抱歉，如果没有帮助，我还是新的：）

只是一个想法。。。使用RGB（lsb）等隐写术方法，将一张图片隐藏在另一张图片中。无论何时按下按钮，隐写术反向工作并显示隐藏的图片。我在python中使用了stepic，工作得很好。对java一无所知。抱歉，如果没有帮助，我还是新来的：）

你有很多打字错误

function nintendo（）
应该是
function nintendo（）

ddocument.getElementById（“wiiu”）
应该是
document.getElementById（“wiiu”）

您还应该将IMG和输入从
中取出并放入
中

你有很多打字错误

function nintendo（）
应该是
function nintendo（）

ddocument.getElementById（“wiiu”）
应该是
document.getElementById（“wiiu”）

您还应该将IMG和输入从
中取出并放入
中

查看此帖子-

此外，您的html结构不正确，应该是：

<html>
    <head>
        <style type="text/css">
        </style>
            <script type="text/javascript">
            </script>
    </head>
<body>

    <!-- all content goes here -->

</body>
</html>
查看此帖子-

此外，您的html结构不正确，应该是：

<html>
    <head>
        <style type="text/css">
        </style>
            <script type="text/javascript">
            </script>
    </head>
<body>

    <!-- all content goes here -->

</body>
</html>
第一个真正的答案：

<div style = "visibility:hidden" id = "xbone"><img src = "xbone.jpg" /></div>
<button type = "button" 
onclick = "document.getElementById("xbone").style.visibility =
"visible"">Display XBONE</button>


显示XBONE
但也要确保并修复语法错误。

第一个真正的答案：

<div style = "visibility:hidden" id = "xbone"><img src = "xbone.jpg" /></div>
<button type = "button" 
onclick = "document.getElementById("xbone").style.visibility =
"visible"">Display XBONE</button>


显示XBONE
但也要确保并修复语法错误