jQuery中.on('input')事件是否存在简写形式？如何实现用户名输入框字符长度的实时显示？

嘿，你的需求我完全get到了——要实时显示用户名输入的长度，而change()方法得等输入框失去焦点才触发，确实没法满足实时更新的要求，你自己写的代码已经完美实现了即时更新的效果👍

不过这里有个小细节可以优化一下：你现在是在focus事件里绑定input监听，这样每次输入框获得焦点时都会重新绑定一次input事件，多次触发focus后可能会导致同一个输入动作触发多次回调函数。可以把input事件的绑定移到外面，这样只绑定一次就够了：

$('#username-input')
  // 聚焦时改变背景色
  .focus(function() {
    $(this).css('background-color', 'yellow');
  })
  // 可选：失焦时恢复背景色
  .blur(function() {
    $(this).css('background-color', '');
  })
  // 实时监听输入变化
  .on('input', function() {
    const length = $(this).val().length;
    $('#username-feedback').text(`Length: ${length}`);
  });

回到你的核心问题：jQuery里针对input事件没有对应的简写方法。

jQuery的事件简写（比如$().change()、$().click()）都是针对那些出现较早、使用频率极高的传统事件，而input事件是HTML5之后逐渐普及的标准事件，jQuery并没有为它单独提供简写形式。所以目前只能通过.on('input', handler)的方式来绑定，这也是官方推荐的写法（替代旧的.bind('input', handler)）。

这种写法虽然没有简写那么短，但已经足够简洁，而且兼容性也很好，完全能满足实时监听输入的需求~

内容的提问来源于stack exchange，提问作者Ankit Raj