Question

有一个输入将触发blur（）事件，而这个输入，我想检测是否由Tab键，Shift + Tab键或单击键触发。我只用Tab键检测并单击即可。但是Shift + Tab键却无法。我尝试使用window.event.shiftKey或使用JQuery方法的on（）进行检测，并附加keyup，keydown，keypress以查看是否先检测另一个。但是，没有成功。我怎么能检测到这个？

我创建了这些代码，但没有人起作用：

1。

var shift_key; var key = window.event.keyCode;
$("#address").on('focusout blur keyup keydown keypress',function(e){
    if(e.type == 'keyup' || e.type == 'keydown' || e.type == 'keypress'){
     if(key == 16){
      shift_key = true;
     }
    }else if((e.type == 'focusout' || e.type == 'blur') && key == 9){
      if(shift_key == true){
       document.getElementById('city').focus();
      }
    }
  });

（这是我尝试捕获一个Shift代码，然后在Tab代码之后捕获的原因。'由于触发键事件时，他不会模糊输入，因此，我试图捕获{{1 }}，keyup或keydown的Shift键。当按下Tab键时，输入会自动模糊，因此，我试图抓住Tab键）
```
keypress
```

Answer 1

也许您正在寻找类似的东西？

var tabKey = false, 
    shiftKey = false;

$('#input').on('blur', function(e) {
  if(tabKey) {
    if(shiftKey) {
      console.log('Blurred by shift + tab');
    }
    else {
      console.log('Blurred by tab');
    }
  }
  else {
    console.log('Blurred by mouse');
  }
  
    tabKey = shiftKey = false;
});

$('#input').on('keydown', function(e) {
  tabKey = e.which === 9 ? true : false;
  shiftKey = e.shiftKey;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input" />

Answer 2

这也许是您想要的，它将检测出用于保留输入内容的事件类型。

$("#z").on('keydown blur', function(e) {
  if (e.shiftKey && e.keyCode === 9) {
    console.log('shift tab')
    return false;
  } else if (e.keyCode === 9) {
    console.log('tab')
    return false;
  } else if(e.type == 'blur')  {
    console.log('mosueOUt')
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="z" />

Answer 3

您不需要存储Shift键。您可以使用e.shiftKey

    $("#address").on('focusout blur keyup keydown keypress',function(e){
        if(e.type == 'keyup' || e.type == 'keydown' || e.type == 'keypress'){
    /*
         if(key == 16){
          shift_key = true;
         }
    */
        }else if((e.type == 'focusout' || e.type == 'blur') && e.key == 9){
          if(e.shiftKey){
           document.getElementById('city').focus();
          }
        }
      });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Address
<input id="address" />
City
<input id="city" />

JavaScript / JQuery-使用blur（）事件检测Shift + Tab

3 个答案: