1

I'm trying to make a simple webpage with javascript. The html works fine, but I can't get the javascript to run. I wanted to know if anyone could give me an idea what was wrong with it?

The html and javascript file and are both in the same folder and I made sure I didn't do anything careless

Here's the code:

var intOne;
var intTwo;
var sec;


window.alert("Testing")
function checkAnswer()
{
  if(quiz.outer.answerbox.value === intOne+intTwo)
  {
    alert("You smart. You loyal.");
    alert("Answer is " + parseInt(intOne+intTwo));
  } else {
    alert("Another One.");
    quiz.outer.answerbox.value="";
  }

}

function displayQuestion()
{
  intOne = Math.floor((Math.random() * 100) + 1);
  intTwo = Math.floor((Math.random() * 100) + 1);
  document.getElementById('quiz.outer.question').innerText= "What is " + intOne + " + " + intTwo + "?";
  quiz.answerbox.value="";
  startTimer();
}

function startTimer()
{
  sec = 0;
  window.setInterval(updateTime(), 1000);
}

function updateTime()
{
  sec++
  timer.innerText=sec;
}
<!Doctype html>
<html>
  <head>
    <title>Adding Quiz</title>
    <script type="text/javascript" src="addingNumbers"></script>
  </head>
  <body onload="displayQuestion()">
    <h1>Adding Quiz<h1>
    <div style="color:blue">
      <form name="quiz" action="#">
        <p id="outer">
          <p id="question">something</p>
            <input type="output" id="answerbox" value=""><br>
            <input type="button" value="Check" onClick="checkAnswer()">
          </p>
    </div>
    <br>
    <p>Time spent on this question so far: <strong id="timer">0</strong> seconds </p>
  </body>
</html>

Oddly enough, the javascript appeared to work when i was posting the snippet, as I received an alert when I ran the code.

Endless
  • 34,080
  • 13
  • 108
  • 131
Jibril Burleigh
  • 104
  • 1
  • 10
  • 7
    `src="addingNumbers"` in your `script` tag - you're missing the file extension. – tymeJV Mar 15 '16 at 20:45
  • 3
    When developing on the web, the developer console is your best friend - you can use it to track network activity, see errors, and all that useful stuff. Look at it with your current code and see what isn't working – Nick Zuber Mar 15 '16 at 20:47
  • 1
    " *I made sure I didn't do anything careless, like forget to add the file extention* " while the `src` attribute of your `script` tag leads to `addingNumbers` ? – KarelG Mar 15 '16 at 20:51
  • 2
    This looks like a joke, your comment says `I made sure I didn't do anything careless, like forget to add the file extention` but you did ` – Ruan Mendes Mar 15 '16 at 20:51
  • No, it was not a joke. I was referring to the actual file extension when I saved the files, not the src attribute... Thanks for the advice... – Jibril Burleigh Mar 15 '16 at 21:01
  • 4
    Why all the down votes? He is a beginner and need help as to why his javascript file won't load/execute – Endless Mar 15 '16 at 22:06
  • 1
    Allman style code formatting for JavaScript is not a great idea. See: http://stackoverflow.com/q/11247328/594235 – Sparky Mar 15 '16 at 22:26
  • I think that JS should not require the extension in the SRC tag since it was already specified as a JS file in the TYPE tag. So it's a perfectly fair question to ask. – Dave Mar 17 '16 at 18:09

2 Answers2

2

Other possible answer if it's is a correct path but won't load anyway could be

  • That you have something blocking javascript file from loading like NoScript, adblock or that you have blocked scripts from loading in your browsers preference/settings
  • Your resources could have been cached by the browser/server and any attempt at changing the code don't make any different until you clear the browsers cache
  • Script won't execute the code if the server adds content-type: text/plain header to the script file that are beeing requested. Even if you try to add type="text/javascript".
  • The page you loaded could also have some Content Security Policy (CSP) header blocking any script file from loading
  • If it's inside a iframe then you could have problem with the sandbox attribute
  • <base> tag could possible change the place it looks for loading any resources (but it looks like you don't have that problem judging by your html code)
  • You might even have a proxy somewhere that strips out <script> tags...
  • A good thumb rule is to always use lowercase letters and use - instead adding-numbers.js instead of addingNumbers.js (maybe some servers, filesystem, browser can have problem distinguish lowercase/uppercase and treat them them differently) I have had problem with that when using git...

What happens if you try to open the script url in the browser directly?
Try using absolute path if that helps...
And of course use the console/network tab to look for what the problem could be

My guess is that it's just simply not found and that the src="addingNumbers" is a wrong path
Are both the html and javascript file even in the same folder?

Endless
  • 34,080
  • 13
  • 108
  • 131
0

You have a bug in your code, but this would not keep it from running.

You are calling the method updateTime and assigning what it returns to the Interval

window.setInterval(updateTime(), 1000);

You need to drop the ()

window.setInterval(updateTime, 1000);

Side note, intervals are not accurate for keeping time. If you're wondering why using setInterval() is not accurate, please read this answer.


Now you need to figure out why the file is not loading. To do that you need to look at the console and the network tab. The console will show any JavaScript errors and the network tab will show if any files did not load (404 not found). As others have pointed out, you are not including a file extension in the script tag.

<script type="text/javascript" src="addingNumbers.js"></script>
Community
  • 1
  • 1
epascarello
  • 204,599
  • 20
  • 195
  • 236
  • 1
    It's true that the `setTimeout()` function isn't accurate for keeping time (eh, it's logical) but you should add text or a link to the post that clarifies it. Or he will end up more confused ... – KarelG Mar 15 '16 at 21:10