Solved

Simple Javascript question:

Posted on 2015-02-18
4
85 Views
Last Modified: 2015-02-18
Here is the entire code I have for my site:

 
<script defer="defer" src = "test.js">
console.log("Test 1");        
setOptions({
		UseFooter: true,
		UseHeader: true,
		Classification: "None",
		Style: "default.css"
	});
console.log("Test 2");
    </script>

Open in new window


Inside of "test.js" is just a simple "console.log("Test 3");" and a setOptions function that takes 1 variable.  In that function is a console.log("Test 4");

What I would EXPECT to happen:  

For the console to show :
Test 1
Test 2
Test 3
Test 4

(Or some variant of that in some order).  

Instead, all I get is "Test 3".  I assume I'm doing something wrong in the actual script code here.
0
Comment
Question by:Javin007
  • 2
  • 2
4 Comments
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 40617636
Hi,
this will not work as the inline script will never get executed as you have both inline script and an external reference (src).
Just use this and it should work as expected:
<script defer="defer" src = "test.js"></script>
<script>
console.log("Test 1");        
setOptions({
		UseFooter: true,
		UseHeader: true,
		Classification: "None",
		Style: "default.css"
	});
console.log("Test 2");
    </script>

Open in new window

See also an explanation:
http://ejohn.org/blog/degrading-script-tags/

HTH
Rainer
0
 
LVL 4

Author Comment

by:Javin007
ID: 40617640
Yeah, I kinda figured that was the problem, so tried it your recommended way. Unfortunately, that way, it doesn't seem to recognize that "setOptions()" is an existing function (presumably because it hasn't actually loaded yet).  

What's the "correct" way to pass parameters to a Javascript plugin?
0
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 500 total points
ID: 40617694
Hi,
simply remove the defer attribute, then this should work.
Normally you use events like body onload etc to execute Javascript after all resources have been loaded.
Personally I use the jQuery framework a lot as it encapsulates some of the important events.
<script src="test.js"></script>
<script>
console.log("Test 1");        
setOptions({
		UseFooter: true,
		UseHeader: true,
		Classification: "None",
		Style: "default.css"
	});
console.log("Test 2");
    </script>

Open in new window

HTH
Rainer
0
 
LVL 4

Author Closing Comment

by:Javin007
ID: 40617709
Ah, thanks!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Jquery driving me nuts... 14 27
Compute age Html 2 24
how can i break an array into a couple 5 23
Jquery if else not working ... WHY? 5 24
Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

761 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question