How do I write "assign a variable if a action happens". I'm writing the following but it always returns 1. Thank you
function openwindow(){
testWindow = window.open("popup.php");
setTimeout(function() { testWindow.close(); },1000);
if(testWindow !== null){
var t = 1;
return t;
}
}
Try this:
if(testWindow != null){
Sorry, wrong. What are you doing? Of course it always return 1. But what do you want to achieve?
setTimeout will be "set" and then instantly the next row of source code will be executed, so what do you expect?
What do you want to do? You're testing the open function, browser everytime opens a window, so return "1" is OK, isn't it?
N.B.: Better way to write your condition is:
if (testWindow != null) {
return 1;
} else {
return 0;
}
or simpler:
return (testWindow != null) ? 1 : 0;
Assuming you want global variable t to be 1 while the window is open and 0 when it's closed after one second, here is better code:
var t = 0;
var testWindow = 0;
function openwindow() {
t = 1;
testWindow = window.open("popup.php");
window.setTimeout(function() { testWindow.close(); t = 0; }, 1000);
}
The testWindow variable is an object and will not be != null when the window is closed. You should use the testWindow.closed property instead. However, as #Tim and #Shadow Wizard pointed out, the timeout will fire after your code has executed.
Depending on what you want to do - you can check the window state as follows:
var testWindow;// declared here so we can access it from outside the function.
function openwindow() {
testWindow = window.open("popup.php");
window.setTimeout(function() { testWindow.close(); }, 1000);
}
if (!testWindow) {
alert('testWindow hasnt been created by openwindow yet');
}
if (testWindow && !testWindow.closed) {
alert('testWindow is open');
}
if (testWindow && testWindow.closed) {
alert('testWindow is closed');
}
This will also work if the user closes the window before you do.
UPDATED:
Just to clarify - and forgive me if you get this already.
What setTimeout does is says:
"execute this given function in a second, but meanwhile carry on executing the rest of this code".
So your function will finish executing as if that setTimeout didn't exist. Later on (after 1 second) the function in the setTimeout will fire.
Hope that's useful.
Related
I've got a small problem (kind of a problem with curiosity actually). Is it possible to create some condition when if the condition is satisfied, the appropriate code is executed? Without use of setInterval and setTimeout of course. Or callback? Maybe AJAX?
var x;
if (x != "undefined") {
//code to be executed
}
setTimeout(function() { x = 3.14; }, 5000);
//after those let's say 5 seconds (the time is random) x becomes defined and the code above is executed
Thanks!
If you're ok with wrapping x inside an object, you can try using setter pattern:
var obj = {};
Object.defineProperty(obj, 'x', { set: function(xval) { /* do stuff; */ } });
// some time later in the code ...
obj.x = somevalue
// do stuff will fire
Or, in the object initializer:
var obj = {
set x(xval) {
// do stuff;
}
}
// some time later in the code...
obj.x = somevalue
// do stuff will fire
Note that the only (but optional) value we can explicitly pass to the callback is the value we set the bound property to (the value of x). (Of course, you can reference anything that obj's scope can see).
See also: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set
when a function depends on another one, I just do a simple callback.
var x;
function check_and_wait(callback) {
if (x != undefined) {
callback();
}
}
check_and_wait(function() {
//code goes here
});
A possible solution using promises:
var x;
var promise = new Promise(function(resolve,reject) {
setTimeout(function() {
x = 3.15;
resolve();
},3000)
});
promise.then(function(){
console.log("code to be executed")
console.log(x)
});
I am trying to understand how this code works. I finally figured out it is a loop. It is not a "while" or "for" loop, but it is a loop nonetheless by virtue of calling itself I think (please correct me if I am wrong).
I understand it's main function: to pass JQuery when it is loaded to my 'foo' function, when ever jQuery has loaded. To do that it checks for jQuery in Window and if not there it resets the timer(). That is the loop. I get that.
Let me explain what I do not understand:
the call: CheckDependency.Deferred.execute(foo);
why the "Deferred" keyword?
execute baffles me: I expect that if I call CheckDependency.Deferred.execute that it would only execute that method. Why does it obviously run the timer function. why could it not simply have that code after the timer() since it keeps looping there and then return jquery?
Speaking of return. Why is there a method in there? CheckDependency.Deferred.execute(foo); is as crazy to me as CheckDependency.Deferred.RETURN.execute(foo); (or some similar crazy statement)
I am fairly new to JavaScript (from PHP). Here the code:
function foo(){ console.log('jQuery found!');
}
var CheckDependency = CheckDependency || { };
CheckDependency.Deferred = function ()
{
var functions = [];
var timer = function() {
if (window.jQuery) {/* && window.jQuery.ui*/
while (functions.length) {
functions.shift()(window.jQuery);
}
} else {
window.setTimeout(timer, 250);
}
};
timer();
return {
execute: function(onJQueryReady)
{
if (window.jQuery) { // && window.jQuery.ui
onJQueryReady(window.jQuery);
} else {
functions.push(onJQueryReady);
}
}
};
}();
CheckDependency.Deferred.execute(foo);
Let me start by saying I'm not a javascript expert, but I dabble :) I'll take a stab at describing what is going on here.
First, This creates a new object called "CheckDependency".
var CheckDependency = CheckDependency || { };
Next, it runs an anonymous function, and stores the result in CheckDependency.Deferred.
CheckDependency.Deferred = function ()
{
.
.
.
.
}()
The anonymous function runs the following code:
var functions = [];
var timer = function() {
if (window.jQuery) {/* && window.jQuery.ui*/
while (functions.length) {
functions.shift()(window.jQuery);
}
} else {
window.setTimeout(timer, 250);
}
};
timer();
The last part of the function code returns a new function execute, which gives CheckDependency.Deferred a function execute.
return {
execute: function(onJQueryReady)
{
if (window.jQuery) { // && window.jQuery.ui
onJQueryReady(window.jQuery);
} else {
functions.push(onJQueryReady);
}
}
};
Finally, this new function is called
CheckDependency.Deferred.execute(foo);
The final result of this is that the code starts a background timer that calls itself until window.jQuery is true - which means jQuery is loaded. Then, the function passed to execute is passed into this loop and so will once jQuery is available, the original function passed to "execute" will be called with the instance of window.jQuery.
I hope I did this justice, and I hope my answer helps! Please let me know if you have any question.
I'm really confused how these work...the timeout does not seem to keep running it calls begin_anim once and then thats it....
So am hoping someone can see where i went wrong and explain how I implement this?
This is my code:
//test data:
//type = 'up';
//div = document.getElementById('theid');
//marginL = -400;
function timeout_begin(type,div,marginL){
setTimeout(begin_anim(type,div,marginL),1000);
}
function begin_anim(type,div,marginL){
if(type == 'up'){
if(marginL >= '-200'){
if(marginL > '-200'){
div.style.marginLeft = '-200px';
}
return false;
}
marginL += 2;
div.style.marginLeft = marginL+'px';
}
return false;
}
Hope you can help!
You're looking for setInterval!
Also, it's probably better to pass an actual function in, and you can hold a reference to the loop so you can stop it running later if you want to:
var animationLoop = setInterval(function () {
begin_anim(type, div, marginL);
}, 1000);
clearInterval(animationLoop); // This would then stop the loop.
First, you want setInterval, not setTimeout
Second, you'll pass a reference to a function, not a call to a function. Something like:
function timeout_begin(type,div,marginL)
{
setTimeout(
function() {
begin_anim(type,div,marginL);
},
1000
);
}
setTimeout is supposed to call the function only once.
if you want to call the method repeatedly use setInterval(function(){}, 1000/*duration*/)
setTimeout is only expected to execute the function once after the given timeout. See the documentation here: http://www.w3schools.com/jsref/met_win_settimeout.asp
You're probably looking for setInterval (http://www.w3schools.com/jsref/met_win_setinterval.asp) which executes the code at the interval you set until clearInterval is called.
Can someone help me rectify the issue related to the setInterval? I'm fairly new to JavaScript, I'm not sure what's wrong here. I have this block in my page:
GlobalTicker.prototype.TickElements = function () {
this.timer = setInterval(this.initializeElement.apply(this) , 1000);
};
GlobalTicker.prototype.initializeElement = function () {
for (var i = 0; i < this.tickerElements.length; i++) {
var existingRun = this.tickerElements[i].secs;
var elementId = $('#' + this.tickerElements[i].id + ' .comment-editor').find('.ticker');
existingRun -= 1;
$(elementId).text(existingRun);
if (existingRun === 0) {
$(elementId).remove();
this.tickerElements.splice(i, 1);
if (this.tickerElements.length == 0) clearInterval(this.tickerElements.timer);
}
}
};
Then somewhere in the code, I have this call in a function
var objTicker = new GlobalTicker();
CommentManagement.prototype.createComment = function (domObject) {
objTicker.TickElements();
};
This function call actually invokes the setInterval function and runs the first iteration and jumps to the initialiseComment(); but once this block is executed, on the next interval, instead of executing the initialiseComment(); again, it jumps back to my function call CreateComment();. What am I doing wrong here?
setInterval() requires a function reference. You were calling the function itself and passing the return result from executing the function (which was undefined) to setInterval(). Since that return value is not a function, there was no callback function for setInterval() to call. Thus, your method was executed once when you first called it, but couldn't be called by the interval.
To fix it, you should change from this:
this.timer = setInterval(this.initializeElement.apply(this) , 1000);
to this:
var self = this;
this.timer = setInterval(function() {self.initializeElement()}, 1000);
Note, the value of this will also be different in the setInterval() callback than the value you want so the one you want is saved here in self so it can be referenced from that. There's also no need to use .apply() in this case because calling a method on an object will automatically set the this pointer as needed.
I have a simple javascript loop on my php page that just adds 1 to a value every second. Well, the loop runs every second, and increments the value.
var test = 0;
function go() {
test = test + 1;
setTimeout(go, 1000);
}
go();
This works fine.
Problem is, the PHP page this runs on is actually inside a div tag that refreshes every 10 seconds. After 10 seconds, the count goes haywire, adding 2 every second, then 3, then 4, etc.
How can I stop this?
Given that the problem appears to be multiple instances of your function running, increasing on each refresh/update of the page, I'd suggest adding a sanity-check to your function:
var test = 0;
var running = running || false;
function go() {
if (running) {
// if an instance of go() is already running, the function quits
return false;
}
else {
running = true; // as the test variable survives I assume this will, too
test = test + 1;
setTimeout(go, 1000);
}
}
go();
As it's probable that test is going to be overwritten every time the page updates, I'd suggest ensuring that the assignation isn't going to overwrite a pre-existing count:
var test = test || 0;
var running = running || false;
function go() {
if (running) {
// if an instance of go() is already running, the function quits
return false;
}
else {
var running = true; // as the test variable survives I assume this will, too
test = test + 1;
setTimeout(go, 1000);
}
}
go();
Bear in mind that you could simply use the existence of the test variable to determine whether the function is currently running or not, but because I don't know if you'll be using that for other purposes I've chosen to create another variable for that purpose (which should hold either true or false Boolean values).
Change: go() to if(!test){ go() }
You'll also have to mend your test variable. So var test = test || 0;