按键处理程序取消事件

Question

我有以下代码

 jQuery('#parent').on('keypress', '.textbox', function(e) {
    var btn = jQuery(this).closest('tr').find('.btn');
    if (btn.length) {
        btn.triggerHandler('click');
    }
});

此代码是一个委托的按键处理程序，它正在侦听具有类值“.textbox”的文本框的事件。 处理程序找到类为“.btn”的按钮并调用其单击处理程序，其中包含一个 ajax 调用。

问题是这似乎阻止了事件完成，即如果框中的值为“2”并且我输入“3”，则处理程序执行但框中的值仍然是“2”而不是“23”。

注释掉btn triggerHandler语句就正常了

知道为什么会这样吗？

Answer 1

我认为你需要 keyup 功能。

$(document).ready(function(){
   $("input").keyup(function(){
var rs= $(this).val();
  alert(rs);
        $("input").css("background-color", "pink");
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Enter your value: <input type="text">

Answer 2

使用keyup 而不是keypress。就像在您的脚本中一样，您触发了另一个事件。

jQuery('#parent').on('keyup', '.textbox', function(e) {
   var btn = jQuery(this).closest('tr').find('.btn');
   if (btn.length) {
     btn.triggerHandler('click');
   }
});

keypress 被triggerHandler 打断，因此不允许发生默认的按键操作。而keyup 将首先执行默认操作，然后监听处理程序。

Answer 3

尝试使用 'keypress' 或 'keyup' 的 'onchange'

  $(document).ready(function(){
  $("input").onchange(function(){
  var rs= $(this).val();
  alert(rs);
  $("input").css("background-color", "pink");
  });
});