Question

我有一个输入字段，并且我想根据键入和按下进行一些计算。我尝试使用onkeyup和onkeydown函数，但是当我从键盘上按下一个键时，它将在控制台中同时打印“ keyup”和“ keydown”。我的输入标签在桌子里面。这是我的代码

  $('table input').on('keyup', function(){
      console.log("keyup");
  });

  $('table input').on('keydown', function(){
      console.log("keydown");
  });

Answer 1

将input更改为keyup：

$('table input').on('keyup', function(){
    var parent = $(this).closest('tr');
    var value = parent.find('[name="item_value[]"]').val();
    var amount = parent.find('[name="quantity[]"]').val();
    var total_cost = value * amount;
    parent.find('[name="total_cost[]"]').val(total_cost);
    total_value = total_value + total_cost;
    document.getElementById('total').value = total_value;
});

详细了解keyup

Answer 2

建议不要将jQuery和纯JavaScript混合使用。您只需要添加keyup keydown而不是input：

$('table input').on('keyup keydown', function() {
  var parent = $(this).closest('tr');
  var value = parent.find('[name="item_value[]"]').val();
  var amount = parent.find('[name="quantity[]"]').val();
  var total_cost = value * amount;
  parent.find('[name="total_cost[]"]').val(total_cost);
  total_value = total_value + total_cost;
  $('#total').val(total_value);
});

Answer 3

您不需要按键和按键按下，它们都将使用相同的按键代码触发。

您应该使用其中一个。区别在于处理上的延迟。

例如，如果您执行KeyUp，则取决于按住键的时间长度，KeyUp仅在释放该键后才触发-与KeyDown相反。

参考W3Schools，您可以通过以下方式实现：（其中键码=以ASCII（https://www.genuinecoder.com/wp-content/uploads/2012/07/asciifull.gif定义的八进制值）

（通过运行此示例，您还会注意到快速的keyDowns和keyUps会在处理过程中引起冲突。您应该使用一个或另一个，而不能两者都使用。）

$("input").keyup(function(e){
   alert(e.keyCode);
    $("input").css("background-color", "pink");
});
$("input").keydown(function(e){
    alert(e.keyCode);
    $("input").css("background-color", "pink");
});

如何为输入标签使用onkeyup和onkeydown？

3 个答案: