index.HTML does not recognize script in folder (chrome) - javascript

I am creating a browser based game with phaser, which involves linking to an external javascript file with my own code in it. For some reason when I use either
<script type="text/javascript" src="/js/main.js"></script> or
<script type="text/javascript" src="js/main.js"></script>
to link the javascript to the HTML, no 404 is thrown but the script does not run. However, if I move main.js to the root directory and put
<script type="text/javascript" src="main.js"></script>
in the exact same spot, the script runs fine. Any theories as to why this is? I am using chrome version 57.0.2987.133. Thanks in advance!

It should be:
<script src="./js/main.js"></script>
You had a simple scoping error and forgot the script's src.

Related

Twitter bootstrap not working from local files

When I include my script like this - loading bootstrap.min.js from a local file on disk, it does not execute my browser code.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js" </script>
I know it can find the file, because if I introduce a misspelling in the file name, Chrome complains, but otherwise not. Same behavior from IE-Edge by the way.
However if I include from the cdn network like this:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
Everything works fine. The setup was suggested in a Coursera course on bootstrap and seems to work for most people, but not all. I am kind of puzzled. Is there a browser/internet setting that is preventing me from executing bootstrap from the disk or something that I am missing?
just change
<script src="js/bootstrap.min.js" </body>
To
<script src="js/bootstrap.min.js"></script>
You probably have not closed your code
Here
<script src="js/bootstrap.min.js" </body>
should be
<script src="js/bootstrap.min.js"></script>

Why do some .js files stop working when downloaded to localhost?

I have a problem that when I use a code that links to a .js file available online, the code works fine but if I try to save this .js file on localhost and then link to it, the code doesn't work. For example, This code
<!DOCTYPE html>
<html>
<head>
<title>MathJax TeX Test Page</title>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
</head>
<body>
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</body>
</html>
works fine, but when I downloaded http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML to localhost and then link to it by changing
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
to
<script type="text/javascript" src="js/MathJax.js"></script>
This code stopped working. I encountered the same problem with pdf.js. This problem doesn't happen with every .js file. For example I downloaded jquery and jquery-ui files to localhost and they worked fine. Also, when I link to my own script files that I wrote the code works fine too.
I have checked that MathJax.js is in the js folder and its with other js files like jquery.js and usually when I use jquery.js I just use the line
<script type="text/javascript" src="js/jquery.js"></script>
My question is: Am I doing something wrong or do these files only work online?
Debug :
Open chrome developer tools by right clicking on page and doing
inspect element or view > developer > developer tools.
Navigate to network.You might have to refresh page after going to network.
Do you see file loads successfully?
If it's red then that means it didn't load correctly.
Right click and open it in new tab and verify path.
Update :
MathJax is a package so you have to link entire package rather than just individual file. Refer here http://docs.mathjax.org/en/latest/start.html#downloading-and-installing-mathjax
Make sure the link to the javascript file is correct.
<script type="text/javascript"
src="js/MathJax.js">
</script>
The above script says the file MathJax.js is inside js directory AND the js directory is at the same level as the file you are linking from
<script type="text/javascript"
src="./js/MathJax.js">
</script>
The ./ gives the file a relative startpoint. However, if the javascript is not in a folder entitled "js" which is sitting in the same folder as your html, this won't work.
The other solution is to build the entire absolute file path to the file in your tag, and end with "/MathJax.js".

Javascript files not working when linked, but work internally?

I've never had a problem until recently, but for some reason when I link my JS files, they won't execute at all. jQuery works, but any files that require jQuery such as easing, and other concept files, they refuse to run in any browser on my machine.
But, here's the odd part. If I wrap all my code in 'script' tags within the HTML document, everything works fine; no issues, bugs, anything. (jquery.js is still linked to the document too).
I'm using Dreamweaver, which tells me they are correctly linked. I'm totally lost by this, I can't work it out.
Here's the HTML: http://jsbin.com/iyagub/1
I don't understand what could cause the JS files to not work.
I'm running it locally, but not on localhost, instead via Windows Explorer. I'm on Windows 8 64-bit. I'm not sure if this is a security issue, but I can't see how as I've said; it all worked fine before like any other project I've worked on.
Remember, if I paste any of the code from the linked JS files in to the HTML document directly with script tags, it works flawlessly.
Does anyone have any idea what it could be?
In your JSBin example:
<script src="js/script.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
Change the order to:
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>
Your problem arises from jquery not being loaded into the document before other scripts try and use it.
If you open your URL in a browser with an opened console: e.g. Firefox + firebug
you will notice some of your scripts are failed to loading.
For example :
http://jsbin.com/iyagub/js/easing.js
is not found.
This could be due to many reason:
Wrong paths?
Wrong server configurations?
A misplaced .htacces with bad Rewritecond -s ?

"Ext is not defined" issue in ExtJS 4

I came across a "Ext is not defined" issue in ExtJS 4.
I am actually testing the example here to starting learning ExtJS 4.
I have my example script file included:
<script type="text/javascript" src="orderRead.js"></script>
<script type="text/javascript" src="order.js"></script>
as well as these ExtJS script files:
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" src="extjs/ext-all-debug.js"></script>
but the problem is still there. Attached is the error message from Firebug:
Put the script tags for the Ext library before the script tags for your example files, so that they are loaded when your code runs.
You should include the ext-base.js and ext-all.js files in following order.
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>

Jquery.load URL from different folder

How do I use .load if my file is in different folder?
I have tried:
$("#messageWindow").load("http://localhost/MainFolder/Messanging/index.php");
$("#messageWindow").load("Messanging/index.php");
$("#messageWindow").load("../Messanging/index.php");
nothing works, I have read topic about different folders when using URL but I can't seem to make their answers work.
Thanks.
Okay, I have Fixed the problem The 1st and 2nd URL above WORKS but I have another problem. The index.php have tons of URLs.
<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
<script src="../plugins/ui/jquery.ui.core.js"></script>
<script src="../plugins/ui/jquery.ui.widget.js"></script>
<script src="../plugins/ui/jquery.ui.datepicker.js"></script>
<script src="../plugins/timezone/jstz.min.js"></script>
<script type="text/javascript" src="file_js/index.js"></script>
but now those URls are not working anymore, and the solution i took was to add the whole URL.
<script type="text/javascript" src="http://localhost/MainFolder/js/jquery-1.7.2.min.js"></script>
<script src="http://localhost/MainFolder/plugins/ui/jquery.ui.core.js"></script>
<script src="http://localhost/MainFolder/plugins/ui/jquery.ui.widget.js"></script>
<script src="http://localhost/MainFolder/plugins/ui/jquery.ui.datepicker.js"></script>
<script src="http://localhost/MainFolder/plugins/timezone/jstz.min.js"></script>
<script type="text/javascript" src="http://localhost/MainFolder/Messanging/file_js/index.js"></script>
this is a hustle if I uploade the file to my web host. I think using relative pathing would do the trick but I don't know how that works.
For jQuery load() you can include the relative path from the current page or an absolute path. If you run the command below in the JS console or firebug you should see this same question twice in your browser.
$("#header").load("/questions/10643503/jquery-load-url-from-different-folder");
Content also needs to come from the same origin as the original page (you can only load content from the same domain).

Categories

Resources