Moved JS to external file; now it doesn't work

JavaScript
1

I had some code that worked wonderful when it was inline. When I moved it to an external JS file, it stopped working and I cannot figure out why. So hopefully one of the bright people here can find my mistake.

I’m using jQuery and echoing the header of the webpage out via a PHP script, like so:



		echo "<script type=\\"text/javascript\\" src=\\"jquery.js\\"></script>\
";
		echo "<script type=\\"text/javascript\\" src=\\"hide.js\\"></script>\
";

The hide.js script looks like this:


$(document).ready(function(){

//Hide div w/id extra
$("#rpg_games").css("display","none");
$("#tabletop_games").css("display","none");

$("#rpg").click(function(){
	if ($("#rpg").is(":checked"))
		{
			$("#rpg_games").show("fast");
		}
		else
		{	    
			$("#rpg_games").hide("fast");
		}
	});
});

$("#mini").click(function(){
	if ($("#mini").is(":checked"))
		{
			$("#tabletop_games").show("fast");
		}
		else
		{	    
			$("#tabletop_games").hide("fast");
		}
	});
});

For the life of me, I have no idea what I’m doing wrong. The hide.js file is located in the same directory as the PHP script, and when I echo out the code inline, it works fine. Yeesh.

2
Off Topic:

Why the double quotes?


echo '<script type="text/javascript" src="jquery.js"></script>'."\
";

More readable and PHP doesn’t have to scan the string for variables to parse as variables aren’t parsed in single quote strings - which makes it slightly faster as well (emphasis on slightly)

3

Perhaps there’s some mod_rewrite jiggery-pokery going on? Best thing is to do view-source with Firefox. See if the <script> tags are there. Then click the src links, and see if the correct JS appears. If not, then you know there’s a problem with where it’s located.

4

On the computer that your using do you have any script blocking software in use, which may be blocking the external script file, if so try whitelisting/allowing the file.

5

Have you checked Firebug? Load the page, click around, test the things the JS is supposed to do. See what the console says.

And have you got a live example?

6

So it should look like this:


		echo "<script type=\\"text/javascript\\ src=\\"hide.js\\">\
";
		echo "$(document).ready(function hide(){";
		echo "</script>\
";

Because, if so, that still doesn’t work. :expressionless:

7

Yeah, I had the exact same thing happen.

I have no clue why this works for me (on this one site), but if I break down and use an absolute path in my src, it works for some reason.
It’s strange, goes against all I thought I knew regarding sourcing…

For some reason this site I’m puttering on is a frigging path nightmare (only responds to absolute, except the line before which uses a relative. WTF?), but maybe that’ll work for you too.

Maybe someone has an idea better than this.

8

Nope, I meant exactly like it was in your OP (I was looking at your newer code)
But that didn’t work. I’m afraid I’m not sure what’s up.

9

Yeah… very mysterious. No idea what’s going on. A live example would help, as it’s hard to tell what’s wrong from the code.

10

Start your external with

$(document).ready(function hide(){

and eliminate your inline function call.

11

Its definitely not a script-blocking issue, and adding a full path doesn’t change anything.

Here is the code that I’ve been using.

12

Yeah, one of the first things I did was to check the page source. The script tags are most definitely being displayed correctly. Clicking on the src links loads the JS. So, yeah, I’m not sure what’s up with this.

13

Because I’m really new to PHP! Thanks for the tip. :slight_smile: