jQuery获取textarea最后输入值时始终返回首次值的解决方案

你当前代码的核心问题是取值逻辑的触发时机错误：你把取值函数Message()绑定在了textarea的onClick事件上，这个事件只会在用户点击输入框的瞬间执行一次。如果用户点击过输入框（此时还未输入内容）、之后输入了新内容但没有再次点击输入框，你后续读取的result变量就还是首次触发时拿到的初始值，自然无法获取最新输入内容。

场景1：需要实时获取用户输入内容（如实时校验、字数统计） #

把textarea的触发事件从onClick替换为onInput，该事件会在用户每次修改输入框内容时自动触发，取值逻辑会同步更新：

<textarea id='txtBackStatus' rows='5' cols='34' onInput="Message()"></textarea>

<script>
function Message(){
  // 每次输入修改都会重新执行取值，拿到的就是最新内容
  const result = $('#txtBackStatus').val();
  // 后续可以把result存入全局变量、做校验/展示等逻辑
  console.log('最新输入内容：', result);
}
</script>

场景2：需要在提交表单/触发其他操作时再取最新值 #

不需要把取值逻辑绑定在textarea本身的事件上，直接在你要触发取值的操作（如提交按钮点击、表单提交）的逻辑里实时取值即可：

<textarea id='txtBackStatus' rows='5' cols='34'></textarea>
<button id="submitBtn">提交内容</button>

<script>
// 给提交按钮绑定点击事件，点击时再执行取值
$('#submitBtn').on('click', function(){
  // 点击提交时再读取textarea的值，就是用户最终输入的内容
  const result = $('#txtBackStatus').val();
  console.log('提交的内容：', result);
})
</script>

• 不要在页面顶层的初始化逻辑里提前缓存textarea的值（比如直接写let globalResult = $('#txtBackStatus').val()或let globalResult = document.getElementById('txtBackStatus').value），这种写法只会执行一次，拿到的永远是页面刚加载的初始值，必须在需要使用值的时机实时调用取值方法，不要提前缓存旧值。

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