如何禁用所有瀏覽器上的退格鍵？

我試圖禁用所有情況下的訂單頁上的退格按鈕，除非當一個textarea或文本輸入是一個活動元素，以防止用戶意外退出訂單。我在大多數瀏覽器中都能正常工作，但在IE（測試IE9，常規和兼容模式）下，它仍允許用戶點擊退格並轉到上一頁。如何禁用所有瀏覽器上的退格鍵？

下面的代碼：

$(document).keypress(function(e){ 
     var activeNodeName=document.activeElement.nodeName; 
     var activeElType=document.activeElement.type; 
     if (e.keyCode==8 && activeNodeName != 'INPUT' && activeNodeName != 'TEXTAREA'){ 
      return false; 
     } else { 
      if (e.keyCode==8 && activeNodeName=='INPUT' && activeElType != 'TEXT' && activeElType != 'text'){ 
       return false; 
      } 
     } 
    });

上，我做錯了什麼在這裏有什麼建議？

謝謝！

來源

2011-06-10 TonyTheJet

我認爲你過於複雜。而不是檢查活動元素，而是找到事件目標。這應該給你你需要的信息。當沒有可見的字符時，最好使用而不是keypress。最後，爲了更好的粒度，最好使用e.preventDefault()。

$(document).keydown(function(e) { 
    var nodeName = e.target.nodeName.toLowerCase(); 

    if (e.which === 8) { 
     if ((nodeName === 'input' && e.target.type === 'text') || 
      nodeName === 'textarea') { 
      // do nothing 
     } else { 
      e.preventDefault(); 
     } 
    } 
});

NB我可以完成這件事倒過來，而不是空if塊和所有的代碼在else塊去，但我認爲這是更具可讀性。

來源

2011-06-10 17:13:43 lonesomeday

+1，過於複雜的是我的第一個念頭了。很好的重構。 – 2011-06-10 19:00:40

非常感謝。我感謝您的幫助！ – TonyTheJet 2011-06-10 19:36:10

準確的我正在尋找的代碼.. TX很多！ – Premkumar 2012-05-25 12:13:15

而不是按鍵，嘗試keydown函數，它會在實際的基於瀏覽器的鉤子之前觸發。另外，放入一個preventDefault（）函數將有助於解決這個問題。 IE：

$(document).keydown(function(e){ 
    e.preventDefault(); 
    alert(e.keyCode); 
});

希望這會有所幫助。

來源

2011-06-10 17:10:01

使用e.which代替e.keyCode; jQuery在瀏覽器中規範化了這個值。

http://api.jquery.com/keydown/

爲了確定哪個鍵被按下，檢查事件對象，它是傳遞給處理功能。雖然瀏覽器使用不同的屬性存儲此信息，jQuery 正常化的.which屬性，因此您可以可靠地使用它來檢索關鍵代碼。

然後，使用e.preventDefault（）;以防止移動到上一頁的默認行爲。

來源

2011-06-10 17:12:47 jvenema

<html> 


<head> 
<script type="text/javascript"> 


function stopKey(evt) { 
    var evt = (evt) ? evt : ((event) ? event : null); 
    var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
    if ((evt.keyCode == 8) && (node.type!="text")) {return false;} 
} 

document.onkeypress = stopKey; 


    </script> 

</head> 
<body onkeydown="return stopKey()"> 
<form> 
    <input type="TEXTAREA" name="var1" > 
    <input type="TEXT" name="var2" > 

</form> 
</body> 
</html

我不得不將onDownKey屬性添加到正文以獲取編輯鍵以轉到函數。

來源

2011-06-10 17:31:12 aerobiotic

你可以在第一行

window.history.forward(1);

來源

2012-06-08 10:55:56

$(document).keydown(function(e) { 
    var elid = $(document.activeElement).is('input'); 
    if (e.keyCode === 8 && !elid) { 
     return false; 
    } 
});

希望做的就是添加下面一行在你頁面的第一個腳本，最簡單的事情，這可能幫助你

來源

2013-01-18 12:28:41 Prashant

好像如果您選擇了單選按鈕,複選框和文件a的主體，則「退格」也將充當「導航返回」脹。真的很煩人的形式 - 尤其是當使用後。所有的表格可能會丟失一個滑動的「退格鍵」-_- ...

老實說 ......誰的想法是允許「退格作爲導航」返回「按鈕！非常糟糕的主意在我看來

我禁用「退格」默認情況下，任何不屬於文本區域或文本字段 - 這樣的：

$(document).keydown(function(e){ 

    console.log(e.keyCode+"\n"); 

    var typeName = e.target.type;//typeName should end up being things like 'text', 'textarea', 'radio', 'undefined' etc. 
    console.log(typeName+"\n"); 



    // Prevent Backspace as navigation backbutton 
    if(e.keyCode == 8 && typeName != "text" && typeName != "textarea"){ 
     console.log("Prevent Backbutton as Navigation Back"+typeName+"\n"); 
     e.preventDefault(); 
    } 
    // 

})

不知道還有什麼地方人會想在這兩個區域以外的後退按鈕的正常行爲。

個

來源

2014-01-27 21:41:37 KDawg

大多數例子似乎是jQuery框架 - 這裏的ExtJS

（我已經得到了很多downvotes的這個最近的，現在的問題上有JQuery的標籤，它沒」的例子之前。如果你喜歡JQuery的話，我可以刪除答案，但它被證明可以幫助其他人不使用該框架）。

要使用此代碼塊添加到您的代碼庫，我建議將它添加到應用程序init函數（）中。

/** 
    * This disables the backspace key in all browsers by listening for it on the keydown press and completely 
    * preventing any actions if it is not which the event fired from is one of the extjs nodes that it should affect 
    */ 
    Ext.EventManager.on(window, 'keydown', function(e, t) {  
     var nodeName = e.target.nodeName.toLowerCase(); 
     if (e.getKey() == e.BACKSPACE) { 
      if ((nodeName === 'input' && e.target.type === 'text') || 
       nodeName === 'textarea') { 
       // do nothing 
      } else { 
       e.preventDefault(); 
      } 
     } 
    });

來源

2014-07-08 14:07:19

正在尋找ExtJS代碼，它的工作:) – 2015-06-29 06:43:50

這可能是不相關的，因爲問題現在已經得到了標籤jQuery，但將離開，因爲它很高興它幫助某人。 – 2015-11-04 13:32:05

document.onkeydown = KeyPress; 
function KeyPress(e) { 
    if (!e.metaKey){ 
    e.preventDefault(); 
    } 
}

來源

2016-06-12 16:54:43

儘管這段代碼可能會解決這個問題，但[包括解釋]（// meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers）確實有助於提高帖子的質量。請記住，您將來會爲讀者回答問題，而這些人可能不知道您的代碼建議的原因。 – 2016-06-12 19:31:54

如何禁用所有瀏覽器上的退格鍵？

回答

相關問題