CODEWITHSUNDEEP
jqueryhtmlcodeigniterboilerplate
ClaytonDaniels
ClaytonDaniels

Reputation: 523

Issue loading jQuery using HTML5 Boilerplate/CodeIgniter

I am starting out and have set up a xampp server on my laptop. I have downloaded the html5boilerplate-codeigniter code and placed it into an appropriate directory on my xampp server and have set up a virtual directory in apache for easy browser access.

I wanted to try a simple jQuery piece of code (I have never used jQuery before) so I took one of my view files from codeigniter and placed some jQuery tutorial code in the file. The code I placed is:

<a href="http://jquery.com/">jQuery</a>
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> -->
<script>
$(document).ready(function(){
$("a").click(function(event){
alert("As you can see, the link no longer took you to jquery.com");
event.preventDefault();
});
});
</script>

I commented out the call to jQuery becuase my understanding is, html5boilerplate already loads jQuery. However, clicking on the jQuery link takes me directly to the jquery page. When I uncomment the call to jQuery... I receive the alert. This tells me that boilerplate isn't loading the jQuery. Is this accurate?

The code of the page in question is here: http://pastebin.com/VfVgbpFY

I am aware of line 146 (src=//ajax) and have added http: to the src attribute, however, same result... no alert.

What am I doing wrong that jQuery wont load. It's positioned at the end of the boilerplate template, to speed up page load (according to documentation)... but is it even loading at all or am I going about this all wrong?

Thanks for any help! It is appreciated.

Upvotes: 0

Views: 1203

Answers (1)

Chris Pratt
Chris Pratt

Reputation: 239290

jQuery is loaded at the bottom of the page, and your script is loading in the content area above it. You're right to have used $(document).ready() but $ doesn't even exist yet, so it's still not going to work. You need to put the code into an external file and load it after the call to load jQuery.

Upvotes: 2

Related Questions