Jump to content

Script won't work properly


brooke_theperson
 Share

Recommended Posts

Hey, so I have a favor to ask. See, I learned to code on codecademy and I use the website to make my 'codebits'. Here, my code is working perfectly, but if I write the code in notepad and save it as an html, none of the jquery or javascript activates. I was wondering if someone could check out my code and figure out why. I don't think you have to go through the whole code. Just look at the script tags and the skeleton of the code, see if you can figure out why it won't work properly when saved as an html file. It would be a HUGE help! Thanks!

<!DOCTYPE html><html><head>    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>    <script  type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script></head><style></style><script></script><body>    <div class = "insideborder">        <div class = "header">            <div id = "home">Go Home</div>            <h3 class = "title">Civil War</h3>        </div>        <div class = "sidebar">            <button id = "before">Before</button>            <button id = "during">During</button>            <button id = "after">After</button>            <button id = "leaders">Leaders</button>            <button id = "battles">Battles</button>            <button id = "soldiers">Soldiers</button>            <button id = "women">Women</button>            <button id = "medicine">Medicine</button>            <button class = "game">Play Game</button>                    </div>        <div class = "body"></div>        <div class = "footer"></div>    </div></body></html>

Based on this, is there any reason why the script would not work when saved as an html file?

Edited by brooke_theperson
Link to comment
Share on other sites

I'd use a text editor specifically designed for writing code like HTML, CSS, JavaScript etc instead of plain notepad. There are plenty of good free ones out there. Using a text editor is helpful in properly setting up and saving your files to the right extension for example in order to run properly.

 

Other than that, I see you have spaces before and after your equal signs. Not entirely sure this matters. Try having them like this instead: id="leaders"

Link to comment
Share on other sites

I use ordinary Notepad all the time for tiny html files and there is no reason it should affect your code.

 

As Don mentions it is unusual to add spaces around equals signs IN HTML CODE, while it is ordinary to do so in Javascript code.

 

Now obviously you need to make sure in your windows folder options that you are not hiding known extensions.

 

I had doubts about...

src="//ajax.googleapis....

...but this is correct as discussed below...

Link to comment
Share on other sites

Oops. I just noticed that your html structure is incorrect. Remember you want to keep everything inside the head or inside the body...

<!DOCTYPE html><html><head></head><body></body></html>

..or in more detail...

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>tab</title><link rel="stylesheet" type="text/css" href="externalstyle.css"/><style>/* comment: local styles go here */</style><script type="text/javascript" src="externaljavascript.js"></script><script>/* comment: local scripts go here */</script></head><body><!-- comment: html content goes here --></body></html>
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...