I have a timer which triggers a function each 3 seconds using setTimeout or setInterval. The point is that I need to execute the countdown before the function instead of execute the function first and then the timer.
This is the code:
var timer;
document.getElementById('myBtn').addEventListener('mousedown', function (){
timer = setInterval(alert("Ey, release the button!"), 3000);
});
And this should be the order of actions:
Click and hold the button.
Start the countdown ...3, 2, 1...
Trigger the function.
You could trigger another function at the end of the timer. Since you only need to call it once.. You could just use setTimeout
document.getElementById('myBtn').addEventListener('mousedown', function (){
alert("Ey, release the button!")
setTimeout(fireMe, 3000);
});
function fireMe() {
// Boom
}
You might also want to add clearTimeout on mouseup event.
Do something like
var timer;
document.getElementById('myBtn').addEventListener('mousedown', function (){
timer = setTimeout(function(){
alert("Ey, release the button!");
}, 3000);
});
Related
There is a variable I want to update every minute.
So am curious whether there is a way in Javascript where I can refresh the whole script after some time instead of the variable itself.
<script>
function vName(){
videos = $('#videos').text();
}
vName();
Use setInterval. Here hello will print each and every 3sec
setInterval(function(){ console.log("Hello"); }, 3000);
You could achive this using an event to listen to the element's change:
(function () {
"use strict";
let videos = '';
$("#videos").on("change", evt => {
videos = $(evt.target).val();
console.log(videos);
});
})();
body {
margin: 20px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="videos" type="text">
Solution
Set interval is a function which is being used to perform any functionality after a specific desired time span . The function is always called again and again after that time period . The below code is an example for setInterval.
Code:-
setInterval(function(){ alert("Video is here "); }, 9000);
Explanation
you can call any method in place of "alert("Video is here")" and the desired time period is being given in place of "9000" that means the specific function is being called after every 9 seconds
You can put your code in setInterval() function, like this
setInterval(()=>{
//your script here
function vName(){
videos = $('#videos').text();
}
vName();
}, 60000);
I want to use clearInterval but I don't know why doesn't work.
var orologio_real; //global variable
$(document).ready(function(){
orologio(1);
$('#change-time').on('click', function(){
clearInterval(orologio_real);
orologio(0);
});
});
function orologio (arg){
orologio_real= setInterval(function(){
alert(arg)
}, 1000);
}
What I don't understand is why if I click on div, clearInterval doesn't work
I think it is a silly mistake. You are setting the time interval all over again inside the click handler. I commented it out, and increased the interval a little so that you get time to click the button
var orologio_real; //global variable
$(document).ready(function(){
orologio(1);
$('#change-time').on('click', function(){
clearInterval(orologio_real);
//orologio(0); //this was the issue
});
});
function orologio (arg){
orologio_real= setInterval(function(){
console.log(arg);
alert(arg);
}, 3000);
}
I'm new to jQuery, I wanted to change the interval in Setinterval every time it gets executed. But in my code it's executed every 1 sec and not incrementing at all
Here's my code,
<script>
var time=1000;
function myFunction() {
setInterval(function(){ alert("Hello"); }, time);
time=time+4000;
}
</script>
I think I'm getting this concept wrong, any help with brief explanation where I'm doing wrong will be helpful
setInterval is called till its stopped.
What you should use if you want variable timer is setTimeout.
<script>
var time=1000;
function myFunction() {
setTimeout(function(){ alert("Hello"); myFunction() }, time);
time=time+4000; // seconds
}
</script>
I want to disable onClick event for one second when user performs onClick event on element with id .flipper. Problem is when I call TriggerOnClick() function, it permanently disable onClick event.
Here is code that I am using
function TriggerOnClick(){
setTimeout(function() {
$(".flipper").off("click", TriggerOnClick);
}, 1000);
$(".flipper").on("click", TriggerOnClick);
}
$(".flipper").click(TriggerOnClick);
Your logic is a bit backwards - you would disable immediately then bind in the timeout:
function TriggerOnClick(){
setTimeout(function() {
$(".flipper").on("click", TriggerOnClick);
}, 1000);
$(".flipper").off("click");
}
You're actually turning it off after one second. And so that it can be crystal clear what's happening first, I'll put the .off at the top of the function:
function TriggerOnClick(){
$(".flipper").off("click");
setTimeout(function() {
$(".flipper").on("click", TriggerOnClick);
}, 1000);
}
$(".flipper").click(TriggerOnClick);
This is probably because the setTimeout function in javascript has a misleading name. It acts more like sleep() or delay() from other languages in that it waits the specified amount of time before executing the function in the first argument.
I think what you want to do here is
function TriggerOnClick() {
setTimeout(function() {
$(".flipper").on("click",TriggerOnClick);
}, 1000);
$(".flipper").off("click", TriggerOnClick);
}
When my AJAX call is completed I need to call setInterval, but when two AJAX calls are made it also calls setInterval twice. How can I stop the previous setInterval?
$(document).ajaxComplete(function () {
$(".iframeFake").load(function () {
var islem = setInterval(function () {
$('.iframeFake').each(function (event) {
console.log(1);
}, 1000);
});
});
In chrome console in first post i get 1 per second - but after second post i get double 1 per second. Where is my problem?
var islem;
$(document).ajaxComplete(function () {
$(".iframeFake").load(function () {
clearInterval(islem);
islem = setInterval(function () {
$('.iframeFake').each(function (event) {
console.log(1);
}, 1000);
});
});
If you want to maintain that there is always one interval, store the variable at a higher scope, and cancel before you create to stop any lingering intervals.
DEMO of the principle in action