3

I have a jquery function that works great hard coded onto the html page right above the head tag

<script type="text/javascript" src="js/jquery.js"></script>    
<script>
$(document).ready(function() {
$('#side-menu').sidr();
});
</script>
</head>

however when i move this to the external .js file that is also right above the head tag, it doesn't work. I'm formatting it on the external.js file like this:

$(document).ready(function() {
$('#side-menu').sidr();
});

and including my external.js file on the html like this:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/external.js"></script>
</head>

is there some syntax i'm missing?

midknyte
  • 587
  • 3
  • 6
  • 18
  • 1
    you need to include your external js file. – levi Feb 14 '15 at 23:54
  • and include it after you include jQuery – thenetimp Feb 14 '15 at 23:57
  • yup, doing that. just edited my question to reflect that. any other reasons it might not be working? thanks guys! – midknyte Feb 15 '15 at 00:05
  • Have you included the sidr plugin library? – kidA Feb 15 '15 at 00:29
  • yup, no typos, but it's definitely not loading. when hard coded it adds a class to the #side-menu div, but when extrnal and i check the source that class hasn't been added. i see this answer here: http://stackoverflow.com/questions/17600264/why-jquery-click-doesnt-work-when-included-in-a-separate-file but i'm not sure what i'm supposed to wrap the function in. his example is a bit different than mine and i'm not advanced enough to know how to modify it. thanks again for any help. – midknyte Feb 15 '15 at 00:34

2 Answers2

3

Without seeing your page I don't know how you are laying it all out, but since it works inline but not externally you could make sure you put:

<script type="text/javascript" src="js/external.js"></script>

...in the same place as you had:

$(document).ready(function() {
$('#side-menu').sidr();
});
Brett
  • 19,449
  • 54
  • 157
  • 290
  • That was it! i had the order mixed up with other scripts, that's why it wasn't running. can't believe i didn't notice that. thanks. – midknyte Feb 15 '15 at 09:17
0
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="js/app.js"></script>
</head>

The jquery src should be always above those external .js files that use jquery.

Gero
  • 12,993
  • 25
  • 65
  • 106