Codepen to web page blues

Just venting … it works in codepen and … not in real life. (and it’s not a cached .js file like last Sunday ;)) … it’s “only” to make it so if you hit enter it’s like mousing and clicking on the button, but that’s an important user-friendliness thing to me. (codepen: https://codepen.io/geonz/pen/KKKqJrM and real page http://www.resourceroom.net/20OER/quiz0.html but I am sure it’s some syntax thing that I just need to dig out… unless there’s some “things newbies always do” that I’m doing and somebody can tell me that ;))

Move all of your script tags to be right before the </body>. You need all of the HMTL of the page loaded before trying to add event listeners to the elements. Also, you have the following code in a script tag and also in the zeroesSript.js file. No reason to duplicate.

P.S. You should also have a </html> after the </body> to be compliant.

Codepen automatically puts the code you place in the JS module at the end of the body. That is the part you were not seeing.

Thanks! I was pretty sure it was a positioning and tagging thing in the transition from codepen to real html… and a thing I can’t really do right at work :wink: (I’m usually in a computer lab w/ college students… quiet on Fridays but always interrupted…)

and it works… I had thought I could have references to script files in the head part.

I meant for you to move the following:

        <script src="tablesScript.js"></script>
        <script src="zeroesScript.js"></script>

to just before the closing body tag and not have the following at the bottom of the body tag.

<script src="tablesScript.js"></script>
        <script src="zeroesScript.js"></script>
        <script>var input = document.getElementById("number001");
input.addEventListener("keyup", function(event) {
  if (event.keyCode === 13) {
   event.preventDefault();
   document.getElementById("check").click();
  }
});</script>