jQuery change事件绑定异常：修改单个输入框致其他输入框值同步错误

你的代码核心问题是jQuery on() 事件委托的参数传法错误，直接导致事件绑定失效、两个输入框的值串改。
jQuery的事件委托语法要求，第二个参数必须是字符串格式的选择器，用来过滤触发事件的子元素。你代码里提前把$('#queryEmailTitle')、$('#queryEmailBody')这两个jQuery对象作为第二个参数传入，jQuery无法识别这个参数为过滤规则，相当于直接给document绑定了两个全局的change事件——只要页面上任意输入框触发change，两个事件的回调函数都会同时执行。
这就是你改标题的时候正文也被同步的原因：修改#queryEmailTitle触发change时，两个回调都拿到同一个事件源（也就是标题输入框）的value，第一个回调把值赋给标题输入框（这步本身是冗余的，等于把元素本身的值再赋值给它自己，没有实际作用），第二个回调把同一个值直接赋给了正文输入框，反过来改正文的时候标题也会被同步成正文的值。

• 事件委托的第二个参数直接传字符串选择器，不要传提前缓存的jQuery对象
• 删掉回调里无意义的重复赋值逻辑，拿到值之后直接走邮件发送逻辑即可

修正后的参考代码：

// 标题输入框change监听
$(document).on('change', '#queryEmailTitle', function() {
  const currentTitle = $(this).val();
  // 此处写采集标题值、触发邮件发送的逻辑即可
});

// 正文输入框change监听
$(document).on('change', '#queryEmailBody', function() {
  const currentBody = $(this).val();
  // 此处写采集正文值、触发邮件发送的逻辑即可
});

如果你的表单元素不是动态插入DOM的，甚至可以不用走document委托，直接给元素绑定事件性能更好：

$('#queryEmailTitle').on('change', function() {
  const currentTitle = $(this).val();
  // 业务逻辑
})
$('#queryEmailBody').on('change', function() {
  const currentBody = $(this).val();
  // 业务逻辑
})

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