I am trying to execute a setInterval function immediately after a button is pressed, then run the function every 5 seconds.
Why does this work:
$(function () {
$('button').on('mousedown', function () {
var checkUser = setInterval(function () {
}, 5000);
checkUser();
});
});
But not this:
$(function () {
$('button').on('mousedown', function () {
var checkUser = setInterval(function () {
}(), 5000);
});
});
Your first one is not executing a function to start as you think it is. Interval retruns an id, not a reference to the method being called. There should be an error in the console.
The second one is calling the function and storing what the function returns as the interval. In your case it is not returning anything so it is storing undefined.
Store the function, reference it, and call it.
$(function () {
$('button').on('mousedown', function () {
var myFunc = function () {
};
var checkUser = setInterval(myFunc, 5000);
myFunc();
});
});
or use Timeout instead of interval.
$(function () {
$('button').on('mousedown', function () {
var myFunc = function () {
/* do stuff */
setTimeout(myFunc, 5000);
};
myFunc();
});
});
Related
I am trying to get ember.run.bind to work but it just doesn't seem to work, any idea? I have tried all combinations
_didInsertElement: Ember.on('didInsertElement', function () {
Ember.run.bind(this, this.doSomething);
})
or
_didInsertElement: Ember.on('didInsertElement', function () {
Ember.run.bind(this, function() {
this.doSomething();
});
})
or
_didInsertElement: Ember.on('didInsertElement', function () {
var _this = this;
Ember.run.bind(this, function() {
_this.doSomething();
});
})
Ember.run.bind() returns a function that you can then call. It's meant for some asynchronous execution, so it doesn't expect to be called immediately, in the case of calling it immediately, it's unlikely you would need to use bind.
var func = Ember.run.bind(this, this.doSomething);
func();
http://emberjs.jsbin.com/diqelezika/edit?html,js,output
In JavaScript, I have an element (which is an input tag).
This code :
element.addEventListener("focus", function () {
this.parentNode.parentNode.style.outline = this.parentNode.parentNode.dataset.ans_outline;
});
When the input is focused, outline is changed immediately.
My question is : how could I delay this event ?
I've tried :
element.addEventListener("focus", function () {
setTimeout(function(node) {
node.parentNode.parentNode.style.outline = node.parentNode.parentNode.dataset.ans_outline;
}(this), 1000)
});
.. But it doesn't work :(
try this:
element.addEventListener("focus", function () {
var node = this;
setTimeout(function() {
node.parentNode.parentNode.style.outline = node.parentNode.parentNode.dataset.ans_outline;
}, 1000)
});
First argument of setTimeout function is function you want to execute (do not call this function directly).
You can store reference to this in node variable and then use it inside your timed out function (see closures)
Remove the reference to the this and give it this way:
element.addEventListener("focus", function () {
$this = this;
setTimeout(function() {
$this.parentNode.parentNode.style.outline = $this.parentNode.parentNode.dataset.ans_outline;
}, 1000)
});
I have the following HTML page:
<html>
<script>
var global = {};
global.obj = {
// when called this function will cause 'hello' to be output to the
// console every 1 second
repeat: function () {
setInterval(function () {
console.log('hello');
}, 1000);
}
}
global.obj.repeat();
global.obj = [];
// even after we overwrite global.obj, 'hello'
// continues to be output to the console every second
</script>
</html>
I want to write a function similar to repeat, except when global.obj is overwritten, setInterval will stop being called
You'll want to use getters/setters, Mozilla has some good docs on this.
You may have to tweak it a bit:
var intervalRef = null;
var global = {objRef: {}};
global.__defineSetter__("obj", function(o) {
if (intervalRef)
clearInterval(intervalRef);
intervalRef = null;
global.objRef = o;
});
global.__defineGetter__("obj", function() {
return global.objRef;
});
global.obj = {
repeat: function () {
intervalRef = setInterval(function () {
console.log('hello');
}, 1000);
}
}
global.obj.repeat();
setTimeout(function() { //this just demonstrates that you can let it run for 5 secs before clearing the timer.
global.obj = [];
}, 5000);
I tested this and verified that it works.
See this Fiddle:
// html
<p id="stopper">Click</p>
// js
var counter = new Object();
counter.timer = setInterval( function(){
console.log("Hello!");
}, 1000 );
$("#stopper").click(function(){
console.log("Stopping");
clearInterval(counter.timer);
});
I have assigned 5000 ms to Settimeout but it is executing before assigned time interval.Can any body explain why it is happening.
<script type="text/javascript">
var getcallback = {
closure: function (callback, functionparam) {
return callback.call(functionparam);
}
}
var cleartimeout;
var startSlideShow = {
timerid: 5000,
startAnimation: function () {
cleartimeout = setTimeout(getcallback.closure(function () {
alert("this is a basic example of chaining methods");
this.startAnimation();
},this), this.timerid);
},
stopAnimation:function(){
}
}
startSlideShow.startAnimation();
</script>
Because getcallback.closure() is executing the function right away, you are not storing a reference to a function to call at a later time.
As soon as you call startAnimation, you're calling getcallback.closure, which immediately calls the callback function. To use setTimeout correctly, you need to either have closure return a function, or not use such a strange thing, and instead just use an anonymous function.
Something along the lines of:
var getcallback = {
closure: function (callback, functionparam) {
return function() {
callback.call(functionparam);
};
}
}
...
Or, to be cleaner, just:
var cleartimeout;
var startSlideShow = {
timerid: 5000,
startAnimation: function () {
cleartimeout = setTimeout(function () {
alert("this is a basic example of chaining methods");
this.startAnimation();
}, this.timerid);
},
stopAnimation:function(){
}
}
startSlideShow.startAnimation();
How can I call a function like this with parameters applied to it?
searchTimer = setTimeout(doSearch, 250);
function doSearch(parameter) {
}
Use an anonymous function as a wrapper:
searchTimer = setTimeout(function () {
doSearch('parameter');
}, 250);