Ein Fall der Verwendung von JavaScript zum Blockieren der Rücktaste

Heute habe ich unter IE-Browser festgestellt, dass es ein seltsames Problem gibt, wenn das readonly="readonly"-Attribut verwendet wird, um das Textfeld auf schreibgeschützt zu setzen: Wenn der Cursor in den schreibgeschützten Text eintritt Durch Drücken der Rücktaste wird auf die vorherige Seite zurückgesprungen. Der Effekt ist, als würde man auf die Zurück-Schaltfläche des Browsers klicken. Unter Firefox und Google gibt es jedoch kein solches Problem. Ich habe eine folgende Verarbeitungsmethode geschrieben: Wenn das Textfeld schreibgeschützt ist, deaktivieren Sie die Rücktaste.

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 der Rücktaste im schreibgeschützten Eingabefeld unter IE“ lösen Zurück zur vorherigen Seite. Problem"

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

Wenn unsere Webseite ein Formular mit einem schreibgeschützten Attribut enthält, sieht es wie folgt aus:

<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, daher wird „readonly“ hinzugefügt = „readonly““, aber unter IE8 ist der Unterschied zwischen diesem und anderen normalen Textfeldern am Erscheinungsbild nicht erkennbar, sodass einige Benutzer möglicherweise einige Vorgänge zum Löschen ausführen oder fügen Sie Inhalte hinzu, wenn sich der Cursor beispielsweise im Textfeld dieses schreibgeschützten Attributs befindet und der Benutzer die Rücktaste (Rücktaste zum Löschen) drückt. Dies führt dazu, dass der gesamte Browser zurückgeht, was die Benutzer sehr erleichtert Zu diesem Zeitpunkt müssen wir einige bestimmte Tasten in diesem schreibgeschützten Textfeld abschirmen, 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 detaillierte Inhalt vonEin Fall der Verwendung von JavaScript zum Blockieren der Rücktaste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!