javascript - 根据输入框中的焦点启用/禁用按键事件

Question

• 如果输入框未获得焦点，则应触发按键事件
• 如果输入框获得焦点，则应禁用按键事件，并且应允许输入文本。
• 我尝试过聚焦和模糊，但没有效果。

HTML

<div class="button">
<button class="btn">1</button>
<button class="btn">2</button>
<button class="btn">3</button>

</div>

<div class="form">
<form action="" id="submit">
  <input type="text" id="num" number/>
</form>
</div>

<div id="show"></div>

JQUERY

$(function($){
        //on click
    $('.btn').click(function(){
                var me = $(this);
        $('#show').html(me.text());
    });
    //on keypress
    $(window).keypress(function(k){         
            switch (k.keyCode) {                
                // user presses the "1"
            case 49:
             $('#show').html(1);
               break;           
                // user presses the "2"
            case 50:
            $('#show').html(2);
               break;

                // user presses the "3"
            case 51:
            $('#show').html(3);
               break;
          }
    });

    //on submit
    $('#submit').submit(function(e){
        e.preventDefault();
      var data = $('#num').val();
      $('#show').html(data);
      $('#num').val('');
    })
});

JSFiddle

Answer 1

尝试在按键事件中检查输入框的焦点属性，例如:

if (!$('#num').is(':focus')) {
  switch (k.keyCode) {
    case 49:
      $('#show').html(1);
      break;
      // user presses the "2"
    case 50:
      $('#show').html(2);
      break;
      // user presses the "3"
    case 51:
      $('#show').html(3);
      break;
    default:
  }
}

您可以在 fiddle 中查看。我已经更新了。