Welcome to HBH! If you have tried to register and didn't get a verification email, please using the following link to resend the verification email.

For loop help, redirect loader


ShadowGate's Avatar
Member
0 0

I am working on a redirect script for a fancybox that loads a video, and then redirects the user to a new webpage when the fancybox is closed. I have the loader, and the redirect working.

However every video that is loaded redirects to the same page. I believe this to be a loop issue, and I could use some help.


var sponsors = [
    {selector: ".video_one", uri: "http://www.mysite.com"}, 
    {selector: ".video_two", uri: "http://www.anothersite.com"}
];

$(document).ready(function(){
    for(var i = 0; i < sponsors.length; i++) {
        var msg = sponsors[i].uri;
        var myDel = function(){window.location.replace(msg);}
        $(sponsors[i].selector).fancybox({
            'width' : '40%',
            'height' : '60%',
            'type' : 'iframe',
            'closeBtn': false,
            'afterClose': function(){myDel();}
        });
    }
});

AldarHawk's Avatar
The Manager
0 0

utilizing a for statement here will not work because you are leaving the page after i=1 so the script in effect closes. You will need to set up an array and call through that.


ShadowGate's Avatar
Member
0 0

Thank you for your reply. However I do not quite understand. I don't leave the page until the event is triggered by closing the fancybox on my site. Im trying to dynamically set up each event. Every video get loaded correctly. However each video only redirects to the last uri in my sponsors object.

I am going to try doing this with an array. I will post the code as soon as I am done. If you could explain the logic a little more I would greatly appreciated it.


ShadowGate's Avatar
Member
0 0

Ok solved the problem. I had to enclose everything in the loop in a function. Weird to me but I guess its a javascript thing.

I found the answer here. sitepoint thread


$(document).ready(function(){
	for(i in mySponsors){
		(function(i){
			$(mySponsors[i][0]).fancybox({
				'width': '40%',
				'height': '60%',
				'type': 'iframe',
				'closeBtn': false,
				'afterClose': function(){window.location.replace(mySponsors[i][1]);}
			});
		})(i);
	}
});```

Thanks for your help. Could still use a clarification as to why this works the way it does though.