brooke_theperson Posted May 12, 2015 Share Posted May 12, 2015 (edited) 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 May 12, 2015 by brooke_theperson Link to comment Share on other sites More sharing options...
Don E Posted May 12, 2015 Share Posted May 12, 2015 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 More sharing options...
davej Posted May 12, 2015 Share Posted May 12, 2015 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 More sharing options...
dsonesuk Posted May 12, 2015 Share Posted May 12, 2015 (edited) '//ajax.googleapis' allows for http: and https: preventing in the latter a insecure web link error message. Edited May 12, 2015 by dsonesuk Link to comment Share on other sites More sharing options...
davej Posted May 12, 2015 Share Posted May 12, 2015 Oops, you're right... http://stackoverflow.com/questions/550038/is-it-valid-to-replace-http-with-in-a-script-src-http Link to comment Share on other sites More sharing options...
brooke_theperson Posted May 12, 2015 Author Share Posted May 12, 2015 Thanks so much, this fixed my problem! Link to comment Share on other sites More sharing options...
davej Posted May 13, 2015 Share Posted May 13, 2015 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 More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now