为什么jQuery Focus函数不能再次使用？

Question

我正在使用jQuery中的focus功能创建效果。 在输入焦点上，div从顶部向下移动，用户可以在此处填充数据，这是我现在想要的jsfiddle示例 ，现在我要解决的问题是，第一次将div正确向下移动时它工作正常，但是当我单击该按钮时再次输入，那段时间不起作用。 我还使用了模糊效果以使焦点从输入中移出，但此后我无法再次单击输入框。 所以我想知道第二次将如何工作。

这是我的jQuery代码，其余示例

$( document ).ready(function() {

      $( "#getcoupon" ).focus(function(){

          $("#toggle").attr('checked', true);


          $(document).keyup(function(e) {
            if (e.keyCode == 27) { 
                $("#toggle").attr('checked', false);
                 // $("#getcoupon").focus();
            }
          }); 
      });
});  

Answer 1

我已经简化了您的代码，如下所示：

$( document ).ready(function() {
  $( "#getcoupon").focus(function(){
    $("#toggle").prop('checked', true);   
  });

  $(document).keyup(function(e) {
    if (e.keyCode == 27) { 
        $("#toggle").prop('checked', false);
        $( "#getcoupon" ).blur();
         // $("#getcoupon").focus();
    }
  });
});