Why won't my JavaScript link work when called from HTML?

Question

I'm pretty new to coding, and I'm trying to complete Codecademy's Javascript course. I've learned a little bit about HTML/CSS and I'm almost done with JavaScript. I've researched people having similar problems, but those solutions typically involve JQuery, which I haven't learned.

Here is my HTML (index.html):

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="main.js"></script>
  </head>
  <body>
  </body>
</html>

Here is the beginning of my JavaScript:

alert();

// Acquire character's name and check to make sure it's a string
var charName = prompt("NASA Receptionist: 'Welcome to Mission Control. 
May I have your last name, please?'");

var nameCheck = function(charName) {
    while (typeof charName === "number") {
        charName = prompt("NASA Receptionist: 'Surely, your name is not 
a number... Please, may I have your last name?'");
    }
};

nameCheck(charName);

NOTE: index.html is in the same folder as main.js

When I open the index.html, nothing happens, not even the opening alert(). Am I missing something?

I'm not exactly sure what that means. I'm using Sublime Text 2 to create the files. The only way I know how to see my file work is to try and run it in my web browser... — Goeff, Jul 05 '16 at 07:21
There was an "unexpected token" error in the Google Developer Tools. I took the ; out of my while loop, and that fixed it!! — Goeff, Jul 05 '16 at 09:06

shivgre · Accepted Answer · 2016-07-05T06:26:21.317

6

You have error in your script as you cannot make javascript statements in multiple lines without using escaping slash .

I was getting this error :

SyntaxError: unterminated string literal

var charName = prompt("NASA Receptionist: 'Welcome to Mission Control.

Here is the modified code :

    alert();

    // Acquire character's name and check to make sure it's a string
    //The \r\n\ will format the string in prompt and make it appear in new line
    var charName = prompt("NASA Receptionist: 'Welcome to Mission Control. \
                        \r\n\May I have your last name, please?'");

    var nameCheck = function(charName) {
        while (typeof charName === "number") {
            charName = prompt("NASA Receptionist: 'Surely, your name is not \
                                \r\n\a number... Please, may I have your last name?'");
        }
    };

    nameCheck(charName);

edited Jul 05 '16 at 06:26

answered Jul 05 '16 at 05:21

shivgre

1,163
2
13
29

2

Close.... but probably not quite what the OP is after. The text in the alerts is formatted badly due to the leading white space on the second line of the strings (https://jsfiddle.net/3mawcL9y/) I suggest using newline charactes instead `\r\n` (https://jsfiddle.net/3mawcL9y/1/) – Jon P Jul 05 '16 at 05:59
@JonP I could achieve the same using \n\, can I? – shivgre Jul 05 '16 at 06:12
1

`r\n\ is the safest option. Different OS' use differnt line ending characters! (http://stackoverflow.com/questions/15433188/r-n-r-n-what-is-the-difference-between-them) – Jon P Jul 05 '16 at 06:16
@JonP I have edited my answer to accommodate your suggested change for fixing bad formatting in prompted text. – shivgre Jul 05 '16 at 06:27
Okay, I can try to make that change and see if it helps. UPDATE: This didn't change anything. I commented out everything except for the opening line alert(); and nothing happens. – Goeff Jul 05 '16 at 07:22
@Goeff you need to clear your cache to allow the browser to fetch the changed main.js. Try ctl+F5 to force the browser to fetch new js file – shivgre Jul 05 '16 at 07:35
@shivgre I just tried your cache clearing suggestion, but that didn't work – Goeff Jul 05 '16 at 07:45
@Goeff could you try firefox firebug console and see if there is any error in firebug console. – shivgre Jul 05 '16 at 07:51
@shivgre Not sure how to do that, but I could try – Goeff Jul 05 '16 at 08:01
I found the Google Developer Tools for Chrome and that helped a bit. The new line suggestion was very helpful, thank you! – Goeff Jul 05 '16 at 09:05

score 2 · Answer 2 · answered Jul 05 '16 at 05:24

2

Check in browser source file whether main.js is loaded.

use alert("= loaded =") to check alert is called or not

answered Jul 05 '16 at 05:24

Sivakumar

349
2
10

score 2 · Answer 3 · answered Jul 05 '16 at 05:36

2

If you are not even getting the syntax error, then I think you maybe referencing main.js incorrectly. Are you sure you have this in the same directory as index.html. Also, each time I run it, the typeof method returns "string", no matter if I enter a number or not.

alert(typeof charName);

answered Jul 05 '16 at 05:36

ShaunK

101
4

Thanks for exposing this. I'll have to figure out something else later. For now, I need to fix my html not accessing my js. My main.js file is in the same folder as my index.html... – Goeff Jul 05 '16 at 07:25

Why won't my JavaScript link work when called from HTML?

3 Answers3