web-dev-qa-db-fra.com

Contrôlez ou désactivez le bouton de retour du navigateur avec Javascript ou AngularJS

Contrôler ou désactiver le bouton de retour du navigateur avec Javascript ou AngularJS

Ici, je ne pose pas de question mais je veux montrer une solution sur la façon dont vous pouvez désactiver et contrôler le bouton Précédent du navigateur si vous utilisez AngularJS ou même avec Javascript

javascriptangularjsbuttonbrowserback
12
Wael

Si vous utilisez simplement Javascript, vous pouvez vérifier comment désactiver le bouton Retour à partir de ce lien:

http://jordanhollinger.com/2012/06/08/disable-the-back-button-using-html5/

Mais ce code ci-dessus ne fonctionnera pas bien avec AngularJS car AngularJS utilise URL_Hash # en arrière-plan, donc ici je vais montrer comment vous pouvez vous retourner:

Dans votre code Javascript principal (pas dans le code AngularJS ou le contrôleur), mettez le code suivant:

// *** Author: Wael Sidawi
// ****  Deactive Back Button **** 
var history_api = typeof history.pushState !== 'undefined';
// history.pushState must be called out side of AngularJS Code
if ( history_api ) history.pushState(null, '', '#StayHere');  // After the # you should write something, do not leave it empty

Et maintenant, dans votre AngularJS Controler, placez le listeur d'événements suivant:

/**
 * Event-Listner for Back-Button
 */
$scope.$on('$locationChangeStart', function(event, next, current){            
    // Here you can take the control and call your own functions:
    alert('Sorry ! Back Button is disabled');
    // Prevent the browser default action (Going back):
    event.preventDefault();            
});

J'espère que cela pourrait vous aider.

Meilleures salutations

Wael

14
Wael