Macbook 触控栏的表单输入事件答案

【问题标题】：Form input events for Macbook touch barMacbook 触控栏的表单输入事件
【发布时间】：2017-09-06 17:29:51
【问题描述】：

当用户通过 MacBook Touch Bar 输入输入时，是否有任何事件在 form 元素上触发？

<textarea id="textarea"></textarea>

(function($) {
  $('#textarea')
    .on('keyup', function() {
      console.log('keyup');
    })
    .on('keydown', function() {
      console.log('keydown');
    })
    .on('keypress', function() {
      console.log('keypress')
    });
})(jQuery);

在 Safari 上，当我使用触控栏“键入”时（例如点击表情符号或自动建议的文本），我在网络检查器控制台中看不到任何事件。但是，常规键盘会按预期触发keydown、keypress 和keyup 事件。

【问题讨论】：

你试过'input'事件吗？

标签： javascript jquery macbookpro-touch-bar

【解决方案1】：

触摸栏似乎不会触发按键事件。

另一种方法是收听input event。

如相关MDN documentation所述，只要值发生更改，就会触发该事件，这意味着当触摸栏更改input/textarea值时它会起作用。

当<input> 或<textarea> 元素的值发生变化时，DOM 输入事件被同步触发。

用法：

document.querySelector('textarea').addEventListener('input', function (event) {
    // ...
});

或者...

$('textarea').on('input', function (event) {
  // ...
});

【讨论】：