获取关键代码/点击/触发更改事件

Question

是否可以从 (jquery) 更改事件处理程序中找出是什么触发了更改事件 - 按下哪个键或鼠标单击？

我的用例：我有 input[type=text] 项目的动态列表，如果用户填写最后一个空项目，我会为另一个项目添加新的 input[type=text] 。如果用户按下选项卡（这触发了更改事件），我想自动聚焦它，但不是例如当用户点击某处时（因此更改也被触发，但用户可能想聚焦其他东西）。

简化示例：

https://jsfiddle.net/yxu82p1o/1/

<input type=text>
<script>
function addMore() {
  $('input').off('change.addMore');
  $('<input type=text>').insertAfter($('input').last()).on('change.addMore', addMore);
}
$('input').on('change.addMore', addMore);
</script>

PS。我可以找到解决方法，例如附加另一个 keyup 事件并从中找出按下的键，但从更改事件中找出导致它的原因会更简单、更清晰。

Answer 1

这可能是一个选项。侦听 input 元素上的 keydown 事件，如果 TAB 键触发事件并且该元素是 input 元素，则触发 input 上的 change 事件] 元素。然后聚焦动态添加的 input 元素。

function addMore() {
  $('input').off('change.addMore');
  $('<input type=text>').insertAfter($('input').last()).on('change.addMore', addMore);
}
$('input').on('change.addMore', addMore);

$('body').on('keydown', 'input', function(e){
  var keyCode = e.keyCode || e.which; 
  if (keyCode == 9 && this.tagName === "INPUT") {
    e.preventDefault();
    $(this).change();
    $(':text').last().focus();
  } 
});

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

获取关键代码/点击/触发更改事件

Get key code / click / which triggered change event

javascript

jquery

onchange