0

I need a link to another page be hidden if the user has previously visited that page.

Essentially I have 3 options. A, B and C. If the user picks A they will see the links to B and C at the bottom of the page, say they then click B, it will have the links to A and C, despite having already gone to page A. I need a way to stop it from showing and I can't find a way to do it.

Any help would be hugely appreciated, thanks

Joshua
  • 3,055
  • 3
  • 22
  • 37
Beltyboy118
  • 23
  • 1
  • 4
  • 1
    Welcome to Stack Overflow. At this site, questions are expected to be accompanied by some attempt at a solution by the author. General questions on how to do something or requests for solutions will cause your question to be closed. If you are brand new to JavaScript, your best bet would be to go to some sort of tutorial site (Google can help you with this) and learn the fundamentals and then come back and post a question with your attempt at a solution and a specific question that we can help with. – Scott Marcus Apr 18 '18 at 20:42
  • Most browsers won't let you do that...its a security issue. – Paulie_D Apr 18 '18 at 20:52
  • https://stackoverflow.com/a/6319143/2802040 – Paulie_D Apr 18 '18 at 20:54
  • 1
    @Paulie_D What? This is not a browser or security issue. It's simply a matter of storing what pages the visitor has been to and showing a customized menu based on that. Cookies or `localStorage` will do the trick. – Scott Marcus Apr 18 '18 at 21:04

2 Answers2

0

I think the closest you can get is to color the visited link same color as background e.g.

a:link {
  display: block;
}

a:visited {
  color: white;
}

JsFiddle: http://jsfiddle.net/77nqph63/
Ref:Stackoverflow

EDIT based on Scott Marcus suggestion.
JsFiddle: https://jsfiddle.net/uduv6bgh/
Ref: External Link

Alvin
  • 290
  • 5
  • 25
  • Wouldn't the closest you can get be to just not show links that shouldn't be shown? I don't understand why all the responses to this seem to think that making the link the same color as the background is the same thing as hidden - it's not. – Scott Marcus Apr 18 '18 at 21:27
  • @ScottMarcus True but how would you detect that a link was visited or not? – Alvin Apr 18 '18 at 21:36
  • You would set up a click event handler for the links and then store a value in a cookie or `localStorage` that indicates which link got clicked. – Scott Marcus Apr 18 '18 at 21:37
  • Hmm! Alternatively hide link based on click using $(this).hide(); http://jsfiddle.net/htofq3nw/ – Alvin Apr 18 '18 at 21:44
  • No, that won't help when the user comes back to the site after leaving it. The OP says that the links should not be seen if the user has previously visited them. That means you must store them in a persistent storage location. – Scott Marcus Apr 18 '18 at 21:45
  • Yeah that wont work as far as I can see. The links are on different pages so whenever you travel to page B, the known visted pages change? If you went BACK to page B, link C would then be hidden but thats not the idea. The page needs to be able to see if links have been visited outside of itself, at least thats what I think has happened. I just tried to run the code but the visted links didn't change. Sorry, I know this doesn't really make any sense – Beltyboy118 Apr 18 '18 at 21:57
  • @Beltyboy118 Check now I edited my answer. Thanks Scott for suggestion. Thanks to Nevyan Neykov for the code. – Alvin Apr 19 '18 at 12:50
-1

If I understand correctly, that after visiting A, you want B to only display a link to C, you could put

a:visited {
  color: white; /* or whatever your background color is */
}

in your css. This solution is kind of hack-y, and they can actually still click the link, but they won't be able to see it easily.

a:visited {
color: white;
}
Here's a link to Google: <a href="http://google.com">Can you see me?</a>
wassona
  • 319
  • 1
  • 9
  • And will the browser know if the user has visited the website? – Pritam Banerjee Apr 18 '18 at 21:16
  • Sort of? The browser history stores which sites a user has visited (as long as it isn't turned off or disabled in some other way). `:visited` uses that history to style links differently if they link to a visited page. For security reasons, the styles `:visited` can apply are very narrow: as an example, it can't even be used to apply `color: transparent`. – wassona Apr 19 '18 at 17:46