SetTimout() function that is in the onclick event of a submit button not working

Question

I have this code at the end of my HTML form, i wanted to do something a few seconds after a the submit button is clicked. However the message is displayed as soon as the button is clicked without the delay, what must i do in order for the delay to work?

<input style="width: 99%" type="submit" onclick="setTimeout(alert('hello'), 10000);" value="Update and Close" />

Answer 1

You are doing correct with setTimeout but use like this

onclick="DoLater(); return false;" 

And the function is

function DoLater(){
  setTimeout(function(){
    alert("hello");
  },10000);
}

Answer 2

There's always jQuery, attach to an on click event

http://jsbin.com/omibusU/2/edit?html,js,output

Answer 3

Try this..

<input style="width: 99%" type="submit" onclick="myFunction();" value="Update and Close" />

<script>
function myFunction()
{
 setTimeout(function(){alert("Hello")},10000);
}
</script>

</body>
</html>

Answer 4

set javascript: in onclick

<input style="width: 99%" type="submit" onclick="javascript:setTimeout(function(){alert('hello')}, 5000);" value="Update and Close" /></td>

jsfiddle

Answer 5

以下将做

onclick="setTimeout(function(){alert('Hello')},3000);"

Answer 6

Not need to use "return false" use "return fnname"

onclick="return fn();" 

function fn() {
    setTimeout(function(){
        alert("hello");
    },1000);
}

Answer 7

Hi the following requirement has to be done like this if the above solution does not work. As you are using a button of type submit you are submitting the form values. To do something after submitting form values(delay in your case) you call javascript on form events.

As I had a similar requirement. I have followed the below approach. Define the function in the head section of the page.

<s:form onsubmit="return javascriptfunctionname();">