如何使用JS或jQuery完全检测不可见的键(ENTER,F1,SHIFT)?

时间:2015-07-07 18:37:17

标签: javascript jquery

首先抱歉,我不知道该怎么称呼这些键(ENTER,F1,HOME等)。

实际上,我正在创建一个输入搜索框,其中onkeyup调用一个函数。当用户输入至少两个键时,我的函数被调用,并且使用AJAX显示相关的搜索结果。问题是当用户按下箭头键,HOME,END等时,我的ajax也被调用,我不想要。当关注输入时按F5键重新加载页面不会重新加载页面,而是调用AJAX,这就是为什么它对我来说是一个大问题。

rowDestination.setRowStyle(style)

我想在$('input[name=\'search\']').on(keyup, function(e) { if ($('input[name=\'search\']').val().length >= 2) { // call ajax to display results.. } }); 中添加一个额外的表达式,用于检查是否按下了不可见的键。喜欢 -

if

如果按下任何可见键,则调用ajax,否则不调用。

我不知道如何实现这一目标。因为我不能为每个键做if ($('input[name=\'search\']').val().length >= 2 && (EXPRESSION FOR VISIBLE KEYS)) { // call ajax to display results.. } ,如A,B,C,\,=,+,1,2,3等

是否有现成的库来检查这个或其他任何方式来执行此操作?请帮帮我。

4 个答案:

答案 0 :(得分:3)

您可以检查navigation controllerDim conn, rs Set conn= createobject("adodb.connection") set rs = createobject("adodb.recordset") conn.Open "Driver={Adaptive Server Enterprise}; Server=xxx.xxx.xxx.xxx; port=yyyy; uid=user; pwd=pwd; db=mydatabase;" rs.open "Select * from blah", conn 是否在48到90之间,这对应于字母表中的任何数字或字母。 http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

e.which

如果你想支持其他仅支持字母数字的方法,我能看到的最简单的方法是创建一个你想要列入白名单的所有密钥代码的数组,并检查数组是否包含密钥代码。这是一个关于如何做到这一点的好主题:How to find if an array contains a specific string in JavaScript/jQuery?

答案 1 :(得分:2)

事件keyCode是您的答案:

$('input[name=\'search\']').keyup(function(event) {
   console.log( event.keyCode );
});

例如, Enter 键的keyCode为13。 您还可以通过以下变量检查 Ctrl Shift Alt 键:

if(event.ctrlKey) {
      if (event.ctrlLeft) {
        console.log('ctrl-left'); 
      }
      else {
        console.log('ctrl-right');
      }
}
event.altKey
...
event.altLeft
...
event.shiftKey
...

对于只接受信件,您可以这样使用:

var letter = String.fromCharCode(e.which);
if (/[a-z\d]/i.test(letter)) {
    // send ajax call
}

答案 2 :(得分:1)

我有另一个解决方案来检查是否按下了可见的字符键。实际上我在代码中使用的基本内容是按下时可见的字符键将改变输入字段值的length。我使用keydown而不是keyup来获取当前按键之前的字符串长度。看看我的代码 -



$('input[name=\'search\']').on('keydown', function() {
      var orig_len = $('input[name=\'search\']').val().length; // this gets the original length just before the key was pressed
      setTimeout(function() {
          if ($('input[name=\'search\']').val().length >= 2 && $('input[name=\'search\']').val().length != orig_len) {
            // my ajax call
          }, 25);
        /* in 25ms the lenght is updated and the if checks
        whether length has changed from previous or not
        because visible char key changes length
        */
      });




setTimeout是必要的,因为这个25ms的经过时间足以在按下当前键后更新输入字段的长度。

请对此进行讨论并告诉我它是否可以或有一些不良影响或可能导致不同浏览器出现问题,因为我还没有在其他浏览器上检查过它。

更新:它在所有主流浏览器上都能正常运行。它按照我的意愿工作。

答案 3 :(得分:0)

另一个答案是一个很好的JavaScript组件来实现一个高级搜索框,比如TypeAhead组件,很简单;)

请看看: https://twitter.github.io/typeahead.js/examples/