显示加载图像，如果我点击按钮使用jQuery和html

xxls0lw8 于 2023-04-29 发布在 jQuery

关注(0)|答案(1)|浏览(137)

我已经尝试了已经存在的例子，但加载图像或gif是不显示时，我点击按钮，这是我做的片段。

(function (d) { 
  d.getElementById('form').onsubmit = function () {
    d.getElementById('submit').style.display = 'block';
    d.getElementById('loading').style.display = 'block';
  };
}(document));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form" action="" >
  <br />  
  <input type="submit"  value="Click!" style="width:100px;" onclick="$('#loading').show();"/>
</form>
<div id="loading" img src="loading.gif" alt="" />Loading!</div>

jquery

来源：https://stackoverflow.com/questions/46909552/show-loading-image-if-i-clicked-button-using-jquery-and-html

1条答案

按热度按时间

8oomwypt1#

你能做到-

默认情况下隐藏图像。
在按钮上应用onclick（）函数，如下所示-

$("button").click(function () {
//SHOW LOADER HERE
$("LOADER_IMG").show();

// YOUR FUNCTIONALITY

// Hide your loader
$("LOADER_IMG").hide();
});

示例如下

$("#start-loader").click(function() {
  $("#loader-gif").show();
  setTimeout(function() {
    $("#loader-gif").hide();
  }, 5000);
});

#loader-gif {
  display: none;
 }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<form id="form" action="" >
  <br />  
  <input type="submit"  value="Click!" id="start-loader"/>
</form>
<img id="loader-gif" src="http://www.autopricemanager.com/img/widget-loader-lg-en.gif" alt="" />

赞(0）回复(0）举报 2023-04-29

我来回答

显示加载图像，如果我点击按钮使用jQuery和html

1条答案

示例如下

相关问题

热门标签

最新问答