Bonjour,
Dans le cadre d'un projet site web réalisé par mon entreprise, on me demande d'ajouter un bouton "précédent" sur certaines pages du site. Le bouton doit avoir le même comportent que le bouton "précédent" d'un navigateur web. Ce besoin est dû au fait que certains utilisateurs n'ont pas la barre des menus en haut en accédant au site. J'utilise la fonction history.back() pour cela, jusque là rien de compliqué. Le problème est que ce bouton ne doit être pas être visible quand le bouton précédent du browser est déactivé (par exemple en ouvrant un nouvel onglet).
Pour cela, je définis la visibilité de mon bouton comme hidden et je le rend visible en cas de besoin.
history.length commence à 0 avec IE et à 1 avec Firefox et Chrome.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17 <img id= "back-button" style = "visibility: hidden;" src= "../backArrow" onclick= "history.back();"> <script type="text/javascript"> $(document).ready(function() { if ( $.browser.msie ) { if(history.length > 0 ){ $("#back-button").attr("style","visibility: visible;"); } } else { if(history.length > 1 ){ $("#back-button").attr("style","visibility: visible;"); } } } ); </script>
Ce code marche bien avec Firefox et Chrome, sauf qu'avec IE, history.length augmente à chaque clic sur le back-button (ainsi qu'en cliquant sur le bouton précédent du browser). Donc imaginons le scénario suivant sous IE:
-L’utilisateur ouvre un nouvel onglet A -> history.length = 0
-Dans le même onglet, l’utilisateur ouvre une nouvelle page B -> history.length = 1
-L’utilisateur clique sur le back-button, il est renvoyé vers la page A mais le back-button est visible puisque history.length = 2.
Auriez-vous des solutions à me proposer? J’espère avoir été clair.
Merci d'avance pour votre aide.
Partager