📅 最后修改于: 2023-12-03 15:02:15.427000 🧑 作者: Mango
当我们需要实时获取 textarea 内容的变化时，可以使用 jQuery 的 change 事件来监听。但是该事件只有在域失去焦点时才会触发，无法实时获取变化的内容。本文将介绍如何使用 jQuery 实现实时监听 textarea 内容的变化。
在使用 jQuery 前，需要先引入 jQuery 库。可以下载 jQuery，也可以使用 CDN 引入：
<!-- 引入 jQuery -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
可以通过 jQuery 的 input 事件来监听 textarea 内容的变化，该事件会在输入时实时触发。
$(document).ready(function() {
$('#textarea').on('input', function() {
var content = $(this).val();
console.log(content);
// 实时获取内容并进行相应操作
});
});
上述代码会监听页面中 id 为 textarea 的元素，每当输入内容变化时，即时获取内容并进行相应操作。
以下是完整的代码片段：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery 检测 textarea 内容的变化</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<textarea id="textarea"></textarea>
<script>
$(document).ready(function() {
$('#textarea').on('input', function() {
var content = $(this).val();
console.log(content);
// 实时获取内容并进行相应操作
});
});
</script>
</body>
</html>
本文介绍了如何使用 jQuery 的 input 事件来监听 textarea 内容的变化。通过监听该事件，可以实现实时获取 textarea 内容的变化并进行相应操作。