隐藏按钮几秒钟onclick [英] Hide button for few seconds onclick

问题描述

我想禁用单击按钮几秒钟，然后在此期间显示图像，然后隐藏图像并再次显示按钮.

i want to disable button on click for few seconds, and show an image during this time, then hide the image and show the button again.

HTML:

<input type="submit" value="Submit" onclick="validate();" name="myButton" id="myButton">  
<img style="display: none;" src="/images/loading.gif" id="myImage">

JavaScript:

function validate(){

var  myButton= document.getElementById('myButton');
var  myImage= document.getElementById('myImage');

                        setTimeout (function(){
                          myButton.style.display ='none';
                        },5000);
                      setTimeout (function(){
                          myImage.style.display ='inline';
                        },5000);
}

问题:

1. 此js代码不会在click上执行，而是在调用此按钮的操作后(使用JSF 2)

1. This js code is not executed onclick, but after the action of this button is invoked (using JSF 2)

调用此代码时，按钮被隐藏并显示了图像，但是再也没有被隐藏，并且按钮也没有再次显示.

When this code is invoked, the button gets hidden and the image appears, but never get's hidden again, and the button is not getting displayed again.

请提出解决方法.

推荐答案

您实际上是在隐藏按钮并在5秒钟后显示图像，然后再不更改它.试试这个:

You're actually hiding the button and showing the image after 5 seconds, then not changing it back. Try this:

function validate(){

    var myButton= document.getElementById('myButton');
    var myImage= document.getElementById('myImage');

    myButton.style.display ='none';
    myImage.style.display ='inline';

    setTimeout (function(){
        myButton.style.display ='inline';
        myImage.style.display ='none';
    },5000);

}

这篇关于隐藏按钮几秒钟onclick的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！