I'm trying to put a code snippet into an external .js. Works fine as is inside the page file but stops working if I pull out the script to an external file. I'm thinking it's a variable issue but I'm not entirely clear how to fix that. Little help. Thanks.
Here's the current working internal code:
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script>
$(document).ready(function(){
$("body").flurry({height:300,frequency:98,speed:4321,small:11,large:61,wind:40,windVariance:98,rotation:272,rotationVariance:98,
startOpacity:1,endOpacity:0,opacityEasing:"cubic-bezier(1,.3,.6,.74)",blur:true,overflow:"hidden",zIndex:9999});
$(".toggle-snow").on("click",function(event){
event.preventDefault();
try{
$("body").flurry("destroy");}
catch(err){
$("body").flurry();}
});
});
</script>
When I pull that third script into a fall.js file, the code stops working. Is there something that I need to add to the external script or the internal file?
--
Ah! Silly me. Needed to just remove the open / closing tag in the fall.js file.
Why do you have the "?>" and inside the fall.js remove the opening and closing tags.
Keep references to the other external files in the html
Before referring to fall.js
How are you trying to register the script?
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script src="fall.js"></script>
This should be enough to make the script work, as long as the fall.js file is served in the /fall.js route
Related
When i add this:
<script src="script.js"></script>
<script src="jquery-3.5.1.min.js"></script>
to my index.html file in the head of the file, and i create a JavaScript file, it looks like the html doesn't recognize it.
But when i add this:
<script type="text/javascript">
//code
</script>
to my index.html file in the body of the file, all of the code i done in JavaScript works.
Can somebody explain why this happens?
It’s always a good practice to add jQuery code just before the closing </body> tag. If you have not done that, then use the defer attribute.
Also if you’re writing jQuery code make sure that your code is placed after the jQuery link code.
Don't add your JS files in the head. You are most likely going to be accessing DOM elements, and those elements are defined in the HTML. If you insert a script above the html, the elements won't be recognized because they're not defined yet. Add all of your scripts after the body, I add mine after the closing html just to be safe. And please add your script after your jQuery script.
I have a script include on a page as following.
<script src="https://domain/demo.js" type="text/html" id="google_script"></script>
Once the demo.js is loaded, I need to grab the content of loaded demo.js without recalling it with ajax. Please share your thoughts if that's possible and how.
Sadly no.
With pure JavaScript you can't get content of other JavaScript file without executing it.
Possible solutions:
Use PHP
Save your JS file as text file and then load it to iframe and get the source
Get the source, but run the script
EDIT:
With JavaScript you can't get full script, but function like:
var funcsourcecode = functionname.toString();
Here is my first main html code
Main HTML file picture
and here is my second of my external file
$(document).ready(function() {
alert("hello");
});
I already tried putting the alert outside of the document ready function it still doesn't work.
I don't know why only the first one works please help. Also when I opened up my devtools and went to console it had a lot of but i can't put most of them because I don't have enough reputation to post more than one link. But here is one,
GET http://online-dnbard.rhcloud.com/tick/5620f410e59615263f000006 net::ERR_NAME_NOT_RESOLVED
ps. I am using brackets.
Note That you load up your external js file before jquery:
<script src="Javascript.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
When you load up your file, you reffer to "$(document).ready", which isn't defined yet, so your browser throws an error.
Just change the order:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="Javascript.js"></script>
ps. Using the console in the future will save you a lot of time ;)
I am using a simple plugin from http://www.highcharts.com/demo/pie-basic which has a javascript file stored in view options. I am using this file in my index.html code as <script src="js/pie1.js"></script> inside <body> tag where pie1 is a javascript file stored in js folder. When i run my html page nothing happens.
can anyone help me where I am getting wrong? I am new to using plugins so please bear with me and correct me if anything is wrong.
Most likely you have this situation because javascript start running the plugin before your html is ready.
Place <script src="js/pie1.js"></script> just before closing tag </body>
By searching a bit, one could find this question about stopping chrome from loading a javascript file.
But this doesn't work for a script which is not linked, for example:
<!-- Some html here -->
<script id="script">
//Some script here
</script>
The script here is coded inside the html page and not linked from an external .js file. As you can see, I'm looking for a way to disable that and only that #script before it gets loaded.
Thanks in advance for your help.