上周提交了一個(gè)項(xiàng)目（內(nèi)部使用的），一同事提出個(gè)BUG，說要禁用退格鍵（backspace或者叫后退鍵），因?yàn)檫@和他的習(xí)慣不一樣，擔(dān)心萬一文字錄入一半，他按了退格鍵，那整個(gè)頁面的內(nèi)容就白填了，然后信誓旦旦的說他做的系統(tǒng)中后退鍵都是不能用的，我這個(gè)系統(tǒng)有問題，當(dāng)時(shí)因?yàn)槭露啵话堰@個(gè)問題記錄下來了，后來查了下他以前做的項(xiàng)目，也沒有對退格鍵進(jìn)行處理。自己的項(xiàng)目都沒處理，到我這嚷嚷來了，算了，不和年輕人一般見識。不就禁用個(gè)后退鍵，簡單。
其實(shí)說禁用也不是完全禁用，后退鍵在各瀏覽器下默認(rèn)為點(diǎn)擊了一下后退按鈕，只要保證正常的文字錄入還可以用，其他情況下的退格鍵一律禁掉。看代碼吧。
當(dāng)鍵盤敲下后退鍵（Backspace）后
1、禁止瀏覽器自動后退
2、但不影響密碼、單行文本、多行文本輸入框等的回退操作
解決方案：
網(wǎng)上搜了一下，發(fā)現(xiàn)有不少解決方案，相比較之下，zywang的方案較佳
在其基礎(chǔ)上，進(jìn)行補(bǔ)充和完善，以滿足需求，整理后的代碼如下：
代碼一、核心代碼：
function forbidBackSpace(e) { var ev = e || window.event; //獲取event對象 var obj = ev.target || ev.srcElement; //獲取事件源 var t = obj.type || obj.getAttribute('type'); //獲取事件源類型 //獲取作為判斷條件的事件類型 var vReadOnly = obj.readOnly; var vDisabled = obj.disabled; //處理undefined值情況 vReadOnly = (vReadOnly == undefined) ? false : vReadOnly; vDisabled = (vDisabled == undefined) ? true : vDisabled; //當(dāng)敲Backspace鍵時(shí)，事件源類型為密碼或單行、多行文本的， //并且readOnly屬性為true或disabled屬性為true的，則退格鍵失效 var flag1 = ev.keyCode == 8 && (t == "password" || t == "text" || t == "textarea") && (vReadOnly == true || vDisabled == true); //當(dāng)敲Backspace鍵時(shí)，事件源類型非密碼或單行、多行文本的，則退格鍵失效 var flag2 = ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea"; //判斷 if (flag2 || flag1) return false; } //禁止后退鍵 作用于Firefox、Opera // document.onkeypress = forbidBackSpace; //禁止后退鍵 作用于IE、Chrome document.onkeydown = forbidBackSpace; 代碼二、
function bindBackEvent() { //防止退格鍵 $(document).keydown(function(e){ e = window.event || e; var code = e.keyCode || e.which; if (code == 8) { var src = e.srcElement || e.target; var tag = src.tagName; if (tag != "INPUT" && tag != "TEXTAREA") { e.returnValue = false; return false; } else if ((tag == "INPUT" || tag == "TEXTAREA") && src.readOnly == true) { e.returnValue = false; return false; } } }); }新聞熱點(diǎn)
疑難解答
