js interdit l'événement de retour du navigateur

Cette fois, je vais vous apporter js pour désactiver les événements de retour du navigateur. Quelles sont les précautions pour désactiver les événements de retour du navigateur dans js. Voici un cas pratique, jetons un coup d'oeil.

Dans le projet, j'ai rencontré le problème d'appuyer sur la touche Retour arrière pour faire revenir le navigateur en arrière. J'ai recherché plusieurs solutions en ligne, mais aucune d'entre elles n'était idéale. Nous avons donc rassemblé la sagesse de chacun et adopté les forces de nombreuses familles, et l’avons résumé comme suit :

1. Définir la méthode de blocage de Backspace dans public js

function banBackSpace(e){
 var ev = e || window.event;
 //各种浏览器下获取事件对象
 var obj = ev.relatedTarget || ev.srcElement || ev.target ||ev.currentTarget;
 //按下Backspace键
 if(ev.keyCode == 8){
 var tagName = obj.nodeName //标签名称
 //如果标签不是input或者textarea则阻止Backspace
 if(tagName!='INPUT' && tagName!='TEXTAREA'){
  return stopIt(ev);
 }
 var tagType = obj.type.toUpperCase();//标签类型
 //input标签除了下面几种类型，全部阻止Backspace
 if(tagName=='INPUT' && (tagType!='TEXT' && tagType!='TEXTAREA' && tagType!='PASSWORD')){
  return stopIt(ev);
 }
 //input或者textarea输入框如果不可编辑则阻止Backspace
 if((tagName=='INPUT' || tagName=='TEXTAREA') && (obj.readOnly==true || obj.disabled ==true)){
  return stopIt(ev);
 }
 }
}
function stopIt(ev){
 if(ev.preventDefault ){
 //preventDefault()方法阻止元素发生默认的行为
 ev.preventDefault();
 }
 if(ev.returnValue){
 //IE浏览器下用window.event.returnValue = false;实现阻止元素发生默认的行为
 ev.returnValue = false;
 }
 return false;
}

Les commentaires sur la méthode sont très clairs, je ne vais donc pas trop expliquer ici.

2. Appelez cette méthode une fois la page chargée

$(function(){
 //实现对字符码的截获，keypress中屏蔽了这些功能按键
 document.onkeypress = banBackSpace;
 //对功能按键的获取
 document.onkeydown = banBackSpace;
 })

Remarque : Séquence de déclenchement d'événement clé : keydown -> keypress -> textInput -> keyup

Il y a un problème : une fois la liste déroulante select développée, les événements du clavier ne peuvent pas être obtenus. Si vous appuyez sur la touche Retour arrière à ce moment, le navigateur reviendra toujours à l'historique ; la liste déroulante de sélection dans la liste déroulante d'easyUI ;

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Effet de glissement des actualités de la page d'accueil JS

Cycle de clic JS pour passer à la lecture des images

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!