Can't load a simple function

Question

Here's my code

<script type="text/javascript" href="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" href="js/js.js"></script>
...
<input type="text" name="city" onkeyup="loadStation(this.value);"/>
...

and the js.js file

//Load Stations
function loadStation(stationCity){
  alert(stationCity);
}

When I try to trigger the loadStation onkeyup, nothing's happening. The path of js/js.js is ok since in the source I can load it.

What could be wrong ?

EDIT

I fell really stupid.... instead of href="" it should have been src="". The funiest thing is that even you guys haven't notice it :P

Thanks

Are you sure that your javascript source path is correct? It is using a relative path so if you are on the page `/foo/bar.php` it will try to load your script from `/foo/js/js.js` and not `/js/js.js`. — detaylor, Aug 30 '11 at 13:53

score 4 · Accepted Answer · edited May 23 '17 at 12:19

4

You could be wrong about `js/js.js` I'd suggest using Firebug and checking that you're not getting a 404 error from your js file. You may have wanted to use a root-relative link to the js file: `/js/js.js` so that you don't have issues with sub-directories.

I've often professed the beauty of HTML CSS & JavaScript as an MVC pattern. So I wont go into that here, however. You should keep your HTML in .html files, your CSS in .css files, and your JavaScript in .js files

Using inline javascript event attributes breaks the nice MVC pattern that I often describe, so it's much better to attach the events in the script itself:

//wrap this in a document.ready or window.onload event callback
//-or-
//place the script *after* the input element has been added to the dom
var input;
//replace with whatever selector 
input = document.getElementsByTagName('input')[0];works
input.onkeyup = function(){ loadStation(this.value) };

...more code...

function loadStation(val)
{
  alert(val);
}

Fiddle

~~A couple more debugging questions: * Are you testing a flat html & js file locally? * Are you uploading flat files to a server? * Are you able to post a url of where the content is located?~~

You're using href instead of src on the script element.

edited May 23 '17 at 12:19

Community

1
1

answered Aug 30 '11 at 13:54

zzzzBov

174,988
54
320
367

With the / or not before js/js.js nothing happens. In the source code, whern I click on it, it load the js file in the source, so the path is right. – Warface Aug 30 '11 at 13:56
@Warface, what are you talking about "in the source code"? What editor are you using? – zzzzBov Aug 30 '11 at 13:57
WIth a simple CTRL-U in Chrome you can see the source code right! and then you can click on the js/js.js path so the source code load the js.js content, and it loads so the path is correct. – Warface Aug 30 '11 at 13:59
I can't add the root-relative /js/js.js because the page called is not in the root but in a directory http://localhost/example/ – Warface Aug 30 '11 at 14:06
I can't call the .js file at all. Seriously WTF ! Seems that the serveur doesn't give a damn about that file and just ignore it. – Warface Aug 30 '11 at 14:22
does a simple `alert('testing')` placed within the file work? – zzzzBov Aug 30 '11 at 14:26
Nope, that's what i'm saying the path is right but the javascript isn't loaded. But if I do the alert in the input, it works... So javascript is enabled on my browser. – Warface Aug 30 '11 at 14:29

score 0 · Answer 2 · answered Aug 30 '11 at 13:57

0

try to add the onkeyup like this in your js file:

$('body').ready(function(){
     $('#idOfInput').onkeyup(function(){
         loadStation(this.value)
     });
});

answered Aug 30 '11 at 13:57

mahulst

443
2
10

Can't load a simple function

2 Answers2