JavaScript 检测 textarea 更改

简介

在 JavaScript 中，想要检测 textarea 是否被更改（即用户是否输入了新内容），可以通过监听 input 或 change 事件来实现。本文将介绍如何使用 JavaScript 检测 textarea 更改，并提供相应的代码片段。

方法一：使用 input 事件

1. 给目标 textarea 元素添加一个 input 事件监听器。
2. 在事件处理函数中，可以通过访问 textarea 的 value 属性获取当前输入框中的内容，并进行相应操作。

使用 input 事件可以实时地检测 textarea 中的更改，无论是通过键盘输入、鼠标粘贴还是其他方式修改 textarea 内容，都会触发该事件。

示例代码：

const textarea = document.getElementById('myTextarea');
textarea.addEventListener('input', function() {
  const content = textarea.value;
  // 对 textarea 内容进行处理，如保存、验证等
});

请替换示例代码中的 myTextarea 为实际需要检测的 textarea 元素的 ID。

方法二：使用 change 事件

1. 给目标 textarea 元素添加一个 change 事件监听器。
2. 在事件处理函数中，通过访问 textarea 的 value 属性获取最新的内容，进行相应操作。

与 input 事件不同，change 事件在 textarea 失去焦点时触发，因此只有在 textarea 内容发生更改后，用户离开输入框时，才会触发该事件。

示例代码：

const textarea = document.getElementById('myTextarea');
textarea.addEventListener('change', function() {
  const content = textarea.value;
  // 对 textarea 内容进行处理，如保存、验证等
});

请替换示例代码中的 myTextarea 为实际需要检测的 textarea 元素的 ID。

结论

通过监听 input 或 change 事件，我们可以轻松地检测 textarea 的更改。使用这些事件可以实时获取用户输入的最新内容，并作出适当的响应。根据实际需求选择合适的事件来检测 textarea 更改。