首页 > 解决方案 > 我是 HTML 新手,我想在函数中添加图像

问题描述

我正在创建我的第一个网站,并希望创建一个按钮,单击该按钮时会显示图像。我一直在寻找答案,但找不到。这是我当前的代码,我基本上只需要知道从这里去哪里。

<button onclick=Taco()>Taco</button>
  <script> function Taco(){
 }
  </script>

标签: htmlimagefunction

解决方案


您需要学习“javascript”以在页面上实现所需的操作。

还有一个名为“jQuery”的库。它基于Javascript。但它使事情变得更简单、更容易。

它有一个名为“hide()”的函数和另一个名为“show()”的函数。

您可以使用这两个功能轻松实现您想要的功能。

你将需要一个点击事件。你可以这样做:

var isClicked = 0; // as a global variable.

$('#yourButtonId').on('click', function(){
    if(isClicked == 0){
       $('#yourImageId').hide();
       isClicked = 1;
    }else{
       $('#yourImageId').show();
       isClicked = 0;
    }
});

例子:

var isClicked = 0;

$('#yourButtonId').on('click', function(){
  if(isClicked == 0){
     $('#yourImageId').hide();
     isClicked = 1;
  }else{
     $('#yourImageId').show();
     isClicked = 0;
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<body>
<button id="yourButtonId">I'M BUTTON</button>
<img id="yourImageId" src="http://ph.cctoday.co.kr/news/photo/201701/1032932_375794_0104.jpeg"/>
</body>

您还可以使用您的“taco”功能,如下所示:

function taco(){
    if(isClicked == 0){
       $('#yourImageId').hide();
       isClicked = 1;
    }else{
       $('#yourImageId').show();
       isClicked = 0;
    }
}

例子:

var isClicked = 0;

function taco(){
  if(isClicked == 0){
     $('#yourImageId').hide();
     isClicked = 1;
  }else{
     $('#yourImageId').show();
     isClicked = 0;
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<button id="yourButtonId" onclick="taco()">I'M BUTTON</button>
<img id="yourImageId" src="http://ph.cctoday.co.kr/news/photo/201701/1032932_375794_0104.jpeg"/>
</body>

如何使用 jQuery?

在这里查看:https ://www.w3schools.com/Jquery/default.asp


推荐阅读