Jump to content

[SOLVED] Change page without opening link


DarkxPunk
 Share

Recommended Posts

Hey everyone, So I am playing around with iOS web apps and I found out that you can hide the browser top bar and bottom bar by using a cool meta tag and then saving the page to the home screen. Now awesome right? Well if you change pages it opens up the browser (thats no fun). Is it possible using JavaScript for it to change the page without opening the link? Thanks for any pointers.Peace

Edited by DarkxPunk
Link to comment
Share on other sites

Thank you! That was exactly right. Now to expand a little... So now that I have this understood I want to pull the correct page based upon the button clicked. I have set up an array:

var link[] = (Object) Array('Home' => 'index.php','About ORMT' => 'about.php','Our RMTs' => 'rmts.php','Get Involved' => 'involved.php','Contact Us' => 'contact.php',);// I bet this is all wrong >.<

Now what needs to happen is onclick compare link to the innerHTML of the buttons and then output the correct page into location.href so location.href = link. Thanks for any help. I have been playing around and can't wrap the loops around my head...

Edited by DarkxPunk
Link to comment
Share on other sites

Figured it out, gotta use switch, if anyone can find a more compact and dynamic way of doing this let me know.

function changePage(link){	var nav = link.innerHTML;	switch(nav)	{		case 'HOME':			location.href = 'index.php';			break;		case 'ABOUT ORMT':			location.href = 'about.php';			break;		case 'OUR RMTs':			location.href = 'rmts.php';			break;		case 'GET INVOLVED':			location.href = 'involved.php';			break;		case 'CONTACT US':			location.href = 'contact.php';			break;	}}

The reason I need it dynamic is I want it so when any anchor is pressed instead of executing the href it will just change the location.href. Maybe it will be easier replacing all hrefs with onclick location.href = page... Idk. Thoughts?

Edited by DarkxPunk
Link to comment
Share on other sites

Okay so I made it dynamic, now how can I make a function that when the page loads all anchors get onclick="changePage(this)" added to them. This is because users will add content on their own so when they put a link it needs to change over to the onclick.Ideas?Here is the code

function changePage(link){	var aHref = link.href;	link.href = null;	location.href = aHref;}

I also need something to tell it to not do it on certain links. Thanks!

Edited by DarkxPunk
Link to comment
Share on other sites

Well, you can use the getElementsByTagName function to get all anchors in the page:

var anchors = document.getElementsByTagName('a');

And then loop through them and assign the handler:

for (var x=0, y=anchors.length; x<y; x++) {  anchors[x].onclick = function() { changePage(this); }}

And for excluding certain links, you could add a class name to them and within your loop check to see if the anchor has the given class name before assigning the handler to it:

<a href='www.google.com' class='no_redirect'>Google</a>

for (var x=0, y=anchors.length; x<y; x++) {  if (anchors[x].className.search(/\s*no_redirect\s*/) == -1) {	anchors[x].onclick = function() { changePage(this); }  }}

There could be errors, as this was written off the top of my head and not tested, but that's the gist of it.

Edited by ShadowMage
Link to comment
Share on other sites

Thank you very much! It's funny last night I was on a roll but never found the getElementByTagName method. Thanks a bunch!
It was probably a typo, but just to be sure its getElementsByTagName.
Link to comment
Share on other sites

I don't see that problem with the code in post 6, he did it correctly there.
Which is why I asked for your code, DarkxPunk. You may have a typo or something that is preventing things from working properly. There may also be other code conflicting with something in the code I provided. We can't know that unless we see what you have.
Link to comment
Share on other sites

Is it possible to search the href for something like .php then apply the on click otherwise don't apply the on click?I tried href.search(".php") but it does not work...Here is some other code I am trying, it does not exclude anchors not linking to ormt.ca though... Why?

var domain = "ormt.ca";for (i = 0; i < a.length; i++){	var link = a[i].href	if (link.indexOf(domain))	{		a[i].onclick = function() {changePage(this);}	}}

Okay so I solved it... But I don't understand how, can anyone explain how that != -1 works? When I read it I see if blah is not equal to -1 than do blah, but instead it's if blah is not equal to -1 do blah? Or am I crazy?

var domain = "ormt.ca";for (i = 0; i < a.length; i++){	var link = a[i].href	if (link.indexOf(domain) != -1)	{		a[i].onclick = function() {changePage(this);}	}}

Edited by DarkxPunk
Link to comment
Share on other sites

The difference is in the way that values are converted to boolean. In if statement only cares about boolean values when determining which block to execute, so any expression in the parens is converted to a boolean value. Some values are "truthy" and some are "falsey". Obviously, boolean true is truthy and false is falsey. The ones that aren't so obvious are the values 0, '' (empty string), and null (I think). Those values are falsey. Anything else is truthy. The indexOf function returns an integer referring to the position of the substring or -1 if the substring isn't found. Since any integer other than 0 is considered truthy, the if statement will evaluate to true for all cases except when the substring is at the beginning of the string being searched (thus returning 0, a falsey value). When you compare the return value to another value using != (or any other comparison operator) you are sending a boolean value to the if statement. Does that all make sense?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...