jQuery href attribute manipulation issues

JavaScript
1

This is my first time posting here, and I am new to jQuery as well. I have been looking over w3school jQuery tutorial and it has been immensly helpful.

On to my problem. I have a client that runs a gaming clan for a particular game. The game uses a system called “Punkbuster” to catch cheaters. Punkbuster takes screenshots of the clients screen and saves them to the game server in a neat little html page as individual <p> and <a> tags with the players name and GUID as well as the time and date of the screenshot.

I have written a PHP script that will load the page as content into a containing div with an id of #screenshots. I am not sure if the PHP script is the problem or if it is jQuery. The html page is accessible at the following URL:
http://208.167.244.33/208.167.244.33/pbsvss.htm

If you use the direct link above then you can click on the image file number to view the screenshot in a new window and the href attribute for the anchor tags is relative to the locaton of the parent page. In other words the links are as follows:
http://208.167.244.33/208.167.244.33/pb000788.htm
But when I load the pbsvss.htm page as content the links are relative to the clan website (http://www.theblacksunclan.net/html/pb0000788.htm), and I get a 404 error because niether htm pages nor the images are stored on the clan website server but are stored rather on the game host server.

I am trying to use jQuery to change the value of the href attribute to the correct url (http://208.167.244.33/208.167.244.33/[the original href attribute value]). For some reason jQuery is having issues with the number of entries returned by the PHP script. I can load the content, then copy the source code into the w3school’s “Try It” window and the code will not work unless I delete some of the entries. Once I do that the code works fine. I am really confused here as I am not able to delete entries from the original file nor do I want too.

Here is the actual webpage, and all of the code except the PHP script are viewable in the source.

Here is the PHP script that retrieves the “pbsvss.htm” file.


<?php
    $lines = file('http://208.167.244.33/208.167.244.33/pbsvss.htm');
         foreach ($lines as $line_num=>$line) 
	{
		echo $line. "</p>\
";
	}
?>

I hope this all makes sense, and any and all help is greatly appreciated. Sorry if this is in the wrong forum. Move it as needed.

2

your code is unnecessarily complicated for what you want to do.

who cares why it works in w3schools and not on your site…it’s a completely different environment. If you want to debug, get a proper debugging environment (for example: use firefox + firebug) to test your scripts yourself.

If I’m not mistaken, even if your hrefs are relative, when you read them with javascript, you won’t get the relative value (the one written in the source code) but it’ll be translated to the full path (so all of your href will start with http://). Besides that, your code searches for links whose href is not “http://” obviously, all of your links will match that condition.

Why are you trying changing the href on mouse over, and then setting it back to the original href?

I think this might work better:

$(document).ready(function(){
	$("#testbutton").click(function() {
		$('#screenshots a').each(function(){
			var over='http://208.167.244.33/208.167.244.33/';
			var current='http://www.theblacksunclan.net/html/';
			
			//cleanup the href, remove the current domain path
			var tmp_href=this.href.split(current).join('');
			if(tmp_href.indexOf(over)!==0){
				$(this).addClass('ss').attr('href',over+tmp_href);
			}
		});
	});
});

change the var “current” with the path of your page. What the code does is first delete that part of the domain from your hrefs, and then adds the “over” var.

There are better ways to do this (like using regular expressions), but that should work.

3

Yes, I know my code is way over complicated. I am a jQuery noob.

So I copied your wonderfully, fantstically simple code into my page, added an id to the button, and viola!! It works perfectly. I addded one more line to make the target _self (at least I can get that much done in jQuery :wink: ).

I am going to look into getting jQuery: Novice to Ninja as soon as I get paid. Thanks so much for your help, you’ve been great.