Implementierungscode für JavaScript zum Schutz der Rücktaste

Dieser Artikel stellt hauptsächlich den Implementierungscode von JavaScript zum Blockieren der Rücktaste vor. Er ist sehr gut und hat den Wert, JavaScript zu lesen und zu lernen. Freunde, die sich für JavaScript interessieren, können sich auf diesen Artikel beziehen 🎜>

Heute habe ich unter

IE-Browser entdeckt, dass es ein seltsames Problem gibt, wenn das -Attribut verwendet wird, um das Textfeld auf schreibgeschützt zu setzenreadonly="readonly": Wenn der Cursor in den Lese- Nur Textfeld und drücken Sie dann die Rücktaste, um zur vorherigen Seite zu springen. Der Effekt ist wie das Klicken auf die Zurück-Schaltfläche des Browsers, um zur vorherigen Seite zurückzukehren. Unter Firefox und Google gibt es jedoch kein solches Problem Um dieses Problem zu lösen, habe ich Folgendes geschrieben. Die Verarbeitungsmethode besteht darin, die Rücktaste zu deaktivieren, wenn das Textfeld schreibgeschützt ist.

Der Code lautet wie folgt:

 //处理键盘事件 禁止后退键（Backspace）密码或单行、多行文本框除外
   function banBackSpace(e){  
     var ev = e || window.event;//获取event对象  
     var obj = ev.target || ev.srcElement;//获取事件源  
     var t = obj.type || obj.getAttribute('type');//获取事件源类型 
     //获取作为判断条件的事件类型
     var vReadOnly = obj.getAttribute('readonly');
     //处理null值情况
     vReadOnly = (vReadOnly == "") ? false : vReadOnly;
     //当敲Backspace键时，事件源类型为密码或单行、多行文本的，
     //并且readonly属性为true或enabled属性为false的，则退格键失效
     var flag1=(ev.keyCode == 8 && (t=="password" || t=="text" || t=="textarea") 
           && vReadOnly=="readonly")?true:false;
     //当敲Backspace键时，事件源类型非密码或单行、多行文本的，则退格键失效
     var flag2=(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea")
           ?true:false;    
     
     //判断
     if(flag2){
       return false;
     }
     if(flag1){  
       return false;  
     }  
   }
 window.onload=function(){
   //禁止后退键 作用于Firefox、Opera
   document.onkeypress=banBackSpace;
   //禁止后退键 作用于IE、Chrome
   document.onkeydown=banBackSpace;
 }

Nachdem Sie diese Verarbeitung hinzugefügt haben, können Sie das Problem „Drücken Sie die Rücktaste im schreibgeschützten Eingabefeld unter IE, um zum zurückzukehren“ lösen vorherige Seite."

ps: Verwenden Sie JS, um die Rücktaste (Rücktaste löschen) oder den perfekten Code für eine bestimmte Taste zu schützen

Wann Es gibt ein Formular mit einem schreibgeschützten Attribut wie folgt:

<input type="text" readonly="readonly" name="HuoShangName" id="HuoShangName" />

Das obige Textfeld wird nur verwendet, um dem Benutzer einige Informationen anzuzeigen, und der Benutzer kann es nicht ändern, also „readonly= „readonly“ ist ein schreibgeschütztes Attribut, aber unter IE8 ist der Unterschied zwischen diesem und anderen normalen Textfeldern am Erscheinungsbild nicht erkennbar, sodass einige Benutzer möglicherweise einige Vorgänge ausführen, um Inhalte zu löschen oder hinzuzufügen, z. B. wann Wenn sich der Cursor im Textfeld dieses schreibgeschützten Attributs befindet und der Benutzer die Rücktaste (Rücktaste zum Löschen) drückt, wird der gesamte Browser zurückgesetzt, was die Leute zu diesem Zeitpunkt sehr deprimiert Sie müssen lediglich dies blockieren. Lesen Sie einige bestimmte Tasten im Textfeld, damit der Browser beim Drücken dieser Tasten nicht zurückgeht, aktualisiert oder vorwärts geht.

<input class="input w350" type="text" readonly="readonly" onkeydown="PingBi(&#39;8&#39;)" name="HuoShangName" id="HuoShangName" />

Im obigen Code bedeutet onkeydown, wenn die Taste gedrückt wird. Hier ist der spezifische Code der JS-Funktion pingbi, der ebenfalls sehr einfach ist:

function PingBi(id){
 var k=window.event.keyCode;
 if(k==id){window.event.keyCode=0;window.event.returnValue=false;return false;}
}

Okay In Wenn sich der Cursor auf diese Weise im Textfeld mit einem schreibgeschützten Attribut befindet und der Benutzer die Rücktaste (Rücktaste zum Löschen) drückt, führt dies nicht dazu, dass der Browser zurückgeht.

Das Obige ist der vom Herausgeber eingeführte Implementierungscode für JavaScript, der die Rücktaste blockiert. Ich hoffe, er wird für alle hilfreich sein! !

Verwandte Empfehlungen:

Teilen von Beispielen für die JavaScript-Implementierung des Lotteriesystems

Detaillierte Erläuterung grundlegender JavaScript-Kenntnisse

Detaillierte Erläuterung der Ladereihenfolge und des Ausführungsprinzips von Hochleistungs-Javascript

Das obige ist der detaillierte Inhalt vonImplementierungscode für JavaScript zum Schutz der Rücktaste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!