I am new to Jquery and my Question is can i delay the click on the submit button for example, you cannot click the submit button for 1 second after submitting so I can prevent the Click spamming on the submit button
this is my Click event
$("#btnConfirmEditNo").click(function (e) {
e.preventDefault();
$('#editContactForm').validationEngine('hide');
editwnd.close();
});
also tried the settimeout() but it delays the closing of the window
This example may help you:
function handleClick(evt) {
$( "#btn" ).prop( "disabled", true );
setTimeout(function() {
$( "#btn" ).prop( "disabled", false );
$('#btn').on('click', handleClick);
}, 1000);
$( this ).off( event );
}
$('#btn').on('click', handleClick);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btn">Click Me</button>function handleClick(evt) {
$( "#btn" ).prop( "disabled", true );
setTimeout(function() {
$( "#btn" ).prop( "disabled", false );
$('#btn').one('click', handleClick);
}, 1000);
}
$('#btn').one('click', handleClick);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btn">Click Me</button>You can register a callback function on a button and subsequently remove that callback using the jquery off method. This means that when the submit button is pressed, you can remove the event handler and then set a timer that will subsequently re-add it after a period of time when the timer fires. You can use the window.setTimer() function to register a function to be called after a period of time.
An alternate algorithm would be to have a class level "flag" that is set when the button is clicked and reset when a timer expires. In your handler for a button press, you would check the value of the flag and, if true, ignore the button press.
Basically setTimeout is used to handle the 1s off state.
Here are two examples:
.one()var $btn = $('#btnConfirmEditNo');
function doSomething() {
// Do here whatever you want
setTimeout(function(){
$btn.one("click", doSomething);
}, 1000);
}
$btn.one("click", doSomething);
function doSomething() {
var el = this;
if(el.noClick) return;
el.noClick = 1;
// Do here whatever you want
setTimeout(function() { el.noClick = 0; }, 1000);
}
$('#btnConfirmEditNo').click(doSomething);
.one(),.on()and.off()