You have to take into account 3 different concepts:
- declare a function
- invoking function (you can say "run" or "call" function as well)
- pass by reference
Declare the function
When you declare a function you are defining it:
function teste(nome){
nome = nome || '';
return 'Olá ' + nome + ', hoje está um lindo dia!';
}
At this point you are not running the function, just to say how it is done.
Invoke function
There are different ways to invoke the function, the most common is
var saudacao = teste('João');
Relatives are the "order" to run the function. In this way you pass an argument to the function, it runs the code that was defined and returns a string "Olá João, hoje está um lindo dia!"
. The function is "consumed" and leaves string in its place. In other words, the variable saudacao
will receive the string value.
If the function does not have return
it will return undefined
.
(This is what you're doing in setInterval! running the function and passing undefined
to setInterval);
Pass by reference
You can pass a function by reference. That is to say the name of it, without running the same one. For example, when you want to run a function in a setInterval, or by a different event listener:
window.addEventListener('mousedown', minhaFn);
window.addEventListener('touchstart', minhaFn);
In this way both events use the same function.
The problem in your code:
Your problem is that you are invoking a function that is consumed immediately before it is used in setInterval
. The function is consumed and, because it has no return 'what happens is
setInterval(undefined, 3000);
What you should do:
setInterval(changeColor, 3000);
or, passing a statement at the moment:
setInterval(function(){
var prm = "1px solid "+cor;
inputUser.style.border = prm;
}, 3000);
But as you see there is a problem in the code. Do not pass the color you need. You can solve this with a gambiarra ( link ):
setInterval(changeColor.bind("blue"), 3000);
function changeColor() {
var prm = "1px solid " + this;
alert(prm);
}
When you use .bind('blue')
you are setting the value of this
within the function.
You can use this:
setInterval(function() {
changeColor('blue');
}, 3000);
that runs the function every 3 seconds.
But what you should do, since it is always the same color, is to change the code to change color by passing the name of the color in another way.