焦點在文本輸入或textarea上時，如何禁用jQuery鍵盤導航？

我正在使用以下代碼以及jQuery，通過在網站的各個頁面之間的左右箭頭鍵啓用鍵盤導航。但是，我也需要在一些頁面上有一個表格。所以，當訪問者使用其中一個表單字段時，我需要禁用鍵盤導航，然後當表單字段不再使用時重新啓用。我可以在此代碼中添加什麼來實現此目的？焦點在文本輸入或textarea上時，如何禁用jQuery鍵盤導航？

$(function() { 
     $(document).keyup(function(e) { 
     switch(e.keyCode) { 
      case 37 : window.location = $('.prev').attr('href'); break; 
      case 39 : window.location = $('.next').attr('href'); break; 
     } 
     }); 
    });

來源

2013-02-17 user981178

你可以將事件附加到切換上一個標誌和關閉禁用它的字段：

$(function() { 
    var navEnabled = true; 

    $(document).keyup(function(e) { 
     if (navEnabled) { 
      switch(e.keyCode) { 
       case 37 : window.location = $('.prev').attr('href'); break; 
       case 39 : window.location = $('.next').attr('href'); break; 
      } 
     } 
    }); 

    $('.disableNav').bind('focus', function (event) { 
     navEnabled = false; 
    }).bind('blur', function (event) { 
     navEnabled = true; 
    }); 
});

您也可以使用:focus選擇器進行研究，但可能會比使用事件跟蹤更糟糕。

來源

2013-02-17 23:18:48

謝謝，這似乎也很好。我不太瞭解Javascript或jQuery知道上述解決方案還是你的解決方案在任何方面都更好。所以，爲了找到一些理由來獎勵一個或另一個答案，我僅僅因爲這是第一個答案而且似乎運作良好，因而授予上述解決方案。 – user981178 2013-02-17 23:28:03

@ user981178這一個會執行得更好，解除綁定/重新綁定會導致很多開銷，只是更新一個變量並在處理程序中檢查它的開銷很小。我能否至少獲得最高票數呢？ – 2013-02-17 23:40:10

我會+1你的答案 - 這是較少的開銷。 – kinakuta 2013-02-18 00:06:42

如何解除綁定輸入的焦點處理程序和模糊重新綁定它：

$(function() { 
    var arrowNav = function (e) { 
     switch (e.keyCode) { 
     case 37: 
      window.location = $('.prev').attr('href'); 
      break; 
     case 39: 
      window.location = $('.next').attr('href'); 
      break; 
     } 

    }; 

    $(document).on('keyup', arrowNav); 

    $('#myInput').focus(function() { 
     $(document).off('keyup', arrowNav); 
    }); 
    $('#myInput').blur(function() { 
     $(document).on('keyup', arrowNav); 
    }); 
});

這裏有一個jsfiddle證明（一定要點擊「結果」區域給它重點對文檔結合工作

來源

2013-02-17 23:12:38 kinakuta

謝謝，這似乎運作良好。 – user981178 2013-02-17 23:25:19

-1

晚會有點晚，但有類似的問題。
我發現the answer在這個相關的問題是一個更直接，更容易維護和更新未來的需求。

[編輯]

要使用Kongi的要求適用於：

$(document).on("keydown", function (e) { 
    if (e.which === 8 && !$(e.target).is("input, textarea")) { 
     e.preventDefault(); 
    } 
});

來源

2016-01-21 09:36:04 Mestika

焦點在文本輸入或textarea上時，如何禁用jQuery鍵盤導航？

回答

相關問題