Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Oct 2007
    Location
    NC
    Posts
    39
    Thanks
    3
    Thanked 1 Time in 1 Post

    Calling a normal JS function from within jquery

    I was having some problems with Opera and the onload attribute of the body tag, so I decided to call the necessary function a different way. window.onload= takes too long for me, so I started calling my function (rndmSource) from within jquery, but if I call rndmSource before the rest of the jquery code, then the jquery does not run. However, if I move "rndmSource();" to where the "end jquery" comment is, then both work fine. Why is this?

    Also, I intend on converting the random image script to jquery in the (hopefully) near future. I just haven't had the time to do so yet and that's why I need this mixture.

    Here's my script:
    Code:
    $(document).ready(function(){
    
    				rndmSource();
    				//Start News Ticker
    				$("#newsContainer .news:first").show();
    				var lngth=$(".news").length;
    				var whch=1;
    				$(".newsnumber:first").html(" (" + whch + "/" + lngth + ")");
    				
    				function changeNews(){
    					var first=$('#newsContainer .news:first').html();
    					$('#newsContainer .news:first').remove();addLast(first);
    					$('#newsContainer .news:first').fadeIn(2000);
    					whch++;
    					if(whch>lngth){whch=1;};
    					$(".newsnumber:first").html(" (" + whch + "/" + lngth + ")");
    				}
    				interval = setInterval(changeNews, 3500);
    				
    				function addLast(first){
    					last = '<span class="news" style="display:none">'+first+'</span>';
    					$('#newsContainer').append(last);
    				}
    				$('#newsHeader').click(changeNews); //enables "fast-forward" by clicking "BBA News"
    				//End News Ticker
    			});
    			//end jquery
    			
    			//Begin normal JS
    			//Start random image script
    			var totalPics=258;
    			var commonSrc='http://bbafnc.org/images/10000/6000/170BE/user/P-IMAGE-';
    			var imagesOnPage=3;
    			var source=new Array(imagesOnPage);
    			
    			function rndmSource(){	
    				for (i=1; i<=imagesOnPage; i++) {
    					source[i]=commonSrc + rndmNum(totalPics) + ".jpg";
    					}
    				preventDuplicate();
    				}	
    					
    			function rndmNum (n){
    				return (Math.floor(Math.random()*n + 1));
    				}
    			
    			//Rework this function to utilize "imagesOnPage" variable. Use for loop, "source[i]" and "source.length" 
    			function preventDuplicate(){
    				if (source[1]!=source[2] && source[1]!=source[3] && source[2]!=source[3]) {insertSource();}
    				else if (source[1]==source[2]){source[1]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				else if	(source[1]==source[3]){source[1]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				else if (source[2]==source[3]){source[2]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				} 
    				
    			function insertSource(){
    				document.getElementById("Image01").src = source[1];
    				document.getElementById("Image02").src = source[2];
    				document.getElementById("Image03").src = source[3]; 
    				}
    			
    			//end random images script
    			
    		</script>

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    The rndmSource() function is probably throwing a JS error, stopping the script. All those global variables... I'm thinking they aren't yet declared when you call rndmSource() and use them all. Try moving the variable declarations to above the jQuery block (or change your code to send all those variables to the function so you know they will be defined within the function).

    Are you using a decent browser (such as Firefox) where you can see the JS errors?

  • #3
    New Coder
    Join Date
    Oct 2007
    Location
    NC
    Posts
    39
    Thanks
    3
    Thanked 1 Time in 1 Post
    I tried moving the global variables up, but no luck. And yes, I'm using Firefox, but the only error in the error console is "document.getElementById('Image02') is null"

    Code:
    <script language="javascript">
    		
    			var totalPics=258;
    			var commonSrc='http://bbafnc.org/images/10000/6000/170BE/user/P-IMAGE-';
    			var imagesOnPage=3;
    			var source=new Array(imagesOnPage);
    			$(document).ready(function(){
    				rndmSource();
    				//Start News Ticker
    				$("#newsContainer .news:first").show();
    				var lngth=$(".news").length;
    				var whch=1;
    				$(".newsnumber:first").html(" (" + whch + "/" + lngth + ")");
    				
    				function changeNews(){
    					var first=$('#newsContainer .news:first').html();
    					$('#newsContainer .news:first').remove();addLast(first);
    					$('#newsContainer .news:first').fadeIn(2000);
    					whch++;
    					if(whch>lngth){whch=1;};
    					$(".newsnumber:first").html(" (" + whch + "/" + lngth + ")");
    				}
    				interval = setInterval(changeNews, 3500);
    				
    				function addLast(first){
    					last = '<span class="news" style="display:none">'+first+'</span>';
    					$('#newsContainer').append(last);
    				}
    				$('#newsHeader').click(changeNews); //enables "fast-forward" by clicking "BBA News"
    				
    				//End News Ticker
    			});
    			//end jquery
    			
    			//Begin normal JS
    			//Start random image script
    			
    			
    			function rndmSource(){	
    				for (i=1; i<=imagesOnPage; i++) {
    					source[i]=commonSrc + rndmNum(totalPics) + ".jpg";
    					}
    				preventDuplicate();
    				}	
    					
    			function rndmNum (n){
    				return (Math.floor(Math.random()*n + 1));
    				}
    			
    			//Rework this function to utilize "imagesOnPage" variable. Use for loop, "source[i]" and "source.length" 
    			function preventDuplicate(){
    				if (source[1]!=source[2] && source[1]!=source[3] && source[2]!=source[3]) {insertSource();}
    				else if (source[1]==source[2]){source[1]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				else if	(source[1]==source[3]){source[1]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				else if (source[2]==source[3]){source[2]=commonSrc + rndmNum(totalPics) + ".jpg"; preventDuplicate();} 
    				} 
    				
    			function insertSource(){
    				document.getElementById("Image01").src = source[1];
    				document.getElementById("Image02").src = source[2];
    				document.getElementById("Image03").src = source[3]; 
    				}
    			
    			//end random images script
    			
    		</script>
    I also tried moving all the global variables into the function itself to ensure that they would be defined when the function ran, but that didn't work either.
    Last edited by SnoringFrog; 08-06-2009 at 05:49 PM.

  • #4
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    I tried moving the global variables up, but no luck. And yes, I'm using Firefox, but the only error in the error console is "document.getElementById('Image02') is null"
    So yeah that is stopping the script in its tracks.

  • Users who have thanked Fumigator for this post:

    SnoringFrog (08-06-2009)

  • #5
    New Coder
    Join Date
    Oct 2007
    Location
    NC
    Posts
    39
    Thanks
    3
    Thanked 1 Time in 1 Post
    Ok, got it, thanks. My problem was due to commenting out a couple lines of HTML that in turn caused the javascript to get that error. Easy fix now that I know what's causing it, and now I know to check the errors for probs (which should have been obvious lol).


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •