web-dev-qa-db-fra.com

Comment faire un lien de retour HTML?

Quel est le moyen le plus simple de créer une balise <a> qui renvoie à la page Web précédente? Fondamentalement, un bouton retour simulé, mais un lien hypertexte réel. Technologies côté client uniquement, s'il vous plaît.

Modifier
Vous recherchez des solutions qui présentent l’avantage d’afficher l’URL de la page sur laquelle vous êtes sur le point de cliquer en survol, comme un hyperlien statique normal. Je préférerais que l'utilisateur ne regarde pas history.go(-1) lorsqu'il survole un hyperlien. Le mieux que j'ai trouvé jusqu'ici est:

<script>
  document.write('<a href="' + document.referrer + '">Go Back</a>');
</script>

document.referrer est-il fiable? Cross-browser safe? Je serai heureux d'accepter une meilleure réponse.

javascripthtmlhyperlink
223
paislee

Cette solution présente l'avantage de montrer l'URL de la page liée au survol, comme le font la plupart des navigateurs par défaut, au lieu de history.go(-1) ou similaire:

<script>
    document.write('<a href="' + document.referrer + '">Go Back</a>');
</script>
95
paislee

Et une autre manière:

<a href="javascript:history.back()">Go Back</a>
459
Bajrang

Le moyen le plus simple consiste à utiliser history.go(-1);

Essaye ça:

<a href="#" onclick="history.go(-1)">Go Back</a>
37
apiguy

vous pouvez essayer javascript

<A HREF="javascript:history.go(-1)">

se référer JavaScript Back Button

EDIT

afficher l'URL de la référence http://www.javascriptkit.com/javatutors/crossmenu2.shtml

et envoyer l'élément lui-même dans onmouseover comme suit

function showtext(thetext) {
  if (!document.getElementById)
    return
  textcontainerobj = document.getElementById("tabledescription")
  browserdetect = textcontainerobj.filters ? "ie" : typeof textcontainerobj.style.MozOpacity == "string" ? "mozilla" : ""
  instantset(baseopacity)
  document.getElementById("tabledescription").innerHTML = thetext.href
  highlighting = setInterval("gradualfade(textcontainerobj)", 50)
}
 <a href="http://www.javascriptkit.com" onMouseover="showtext(this)" onMouseout="hidetext()">JavaScript Kit</a>

vérifier jsfiddle

35
Hemant Metalia

Un lien en arrière est un lien qui déplace le navigateur en arrière d'une page, comme si l'utilisateur avait cliqué sur le bouton Retour disponible dans la plupart des navigateurs. Les liens de retour utilisent JavaScript. Il recule le navigateur d'une page si votre navigateur prend en charge JavaScript (ce qui est le cas) et s'il prend en charge l'objet window.history, qui est nécessaire pour les liens retour.

Des moyens simples sont

<a href="#" onClick="history.go(-1)">Go Back</a>

OU:

function goBack() {
  window.history.back()
}
<a href="#" onclick="goBack()" />Go Back</a>

En règle générale, un lien de retour n'est pas nécessaire… le bouton Retour suffit généralement assez bien et vous pouvez également simplement créer un lien vers la page précédente de votre site. Cependant, il peut arriver que vous souhaitiez fournir un lien vers l'une des pages "précédentes", et c'est là qu'un lien en arrière est utile. Donc, je vous renvoie ci-dessous tutoriel si vous voulez faire de manière plus avancée:

http://www.htmlcodetutorial.com/linking/linking_famsupp_108.html

18
user319198

Cette solution vous offre le meilleur des deux mondes

  • Les utilisateurs peuvent survoler le lien pour voir l'URL 
  • Les utilisateurs ne se retrouvent pas avec une pile de retour corrompue

Plus de détails dans les commentaires de code ci-dessous.

var element = document.getElementById('back-link');

// Provide a standard href to facilitate standard browser features such as 
//  - Hover to see link
//  - Right click and copy link
//  - Right click and open in new tab
element.setAttribute('href', document.referrer);

// We can't let the browser use the above href for navigation. If it does, 
// the browser will think that it is a regular link, and place the current 
// page on the browser history, so that if the user clicks "back" again,
// it'll actually return to this page. We need to perform a native back to
// integrate properly into the browser's history behavior
element.onclick = function() {
  history.back();
}
<a id="back-link">back</a>

15
Vivek Maharajh

Meilleure façon de lier votre navigateur à la page précédente.

<a href="javascript:history.back()">Back</a>
8
Siva Ganesh

essaye ça

<a href="javascript:history.go(-1)"> Go Back </a>
7
mack

Pour revenir à la page précédente en utilisant Anchor Tag <a>, vous trouverez ci-dessous deux méthodes de travail. La première est plus rapide et avez un avantage considérable à revenir en arrière. à la page précédente.

J'ai essayé les deux méthodes.

1)

<a href="#" onclick="location.href = document.referrer; return false;">Go Back</a>

La méthode ci-dessus (1) fonctionne très bien si vous avez cliqué sur un lien et lien ouvert dans un nouvel onglet dans la fenêtre de navigation actuelle.

2)

<a href="javascript:history.back()">Go Back</a>

La méthode ci-dessus (2) ne fonctionne correctement que si vous avez cliqué sur un lien et lien ouvert dans un onglet actif dans la fenêtre de navigation actuelle.

Cela ne fonctionnera pas si vous avez un lien ouvert dans le nouvel onglet. Ici, history.back() ne fonctionnera pas si le lien est ouvert dans le nouvel onglet du navigateur Web.

4
VirenPanchal
<a href="#" onclick="history.back();">Back</a>
4
Roee Gavirel

Vous pouvez également utiliser history.back() à côté de document.write() pour afficher le lien uniquement lorsqu'il existe un emplacement vers lequel revenir:

<script>
  if (history.length > 1) {
    document.write('<a href="javascript:history.back()">Go back</a>');
  }
</script>
0
Leonid Vasilev