如何在textarea中使用jQuery处理手动换行？

``javascript，$(textarea).on('keydown', function(e) {， if (e.keyCode === 13) {， e.preventDefault();， this.value = this.value + '，';， }，});，``jQuery处理textarea中的手动换行

代码示例

$(document).ready(function() {    // **textarea的输入事件    $('textarea').on('input', function() {        var textArea = $(this);        var lines = textArea.val().split('\n');        var formattedText = '';        // 遍历每一行，进行格式化处理        for (var i = 0; i < lines.length; i++) {            formattedText += '<p>' + lines[i] + '</p>';        }        // 将格式化后的文本插入到一个新的p中        $('#output').html(formattedText);    });});

单元表格

功能	描述
**textarea的输入事件	使用input事件来实时捕获用户在textarea中的输入。
分割文本为多行	通过split('\n')方法将textarea的值按换行符分割成数组。
格式化文本	遍历每一行，将其包裹在 标签中，以实现段落效果。
输出格式化后的文本	将格式化后的文本插入到id为output的p元素中。

相关问题与解答

问题1：如何修改上述代码以支持多个textarea元素？

答案：要支持多个textarea元素，可以使用类选择器而不是ID选择器，并遍历所有匹配的元素，以下是修改后的代码：

$(document).ready(function() {    // **所有textarea的输入事件    $('.my-textarea').on('input', function() {        var textArea = $(this);        var lines = textArea.val().split('\n');        var formattedText = '';        for (var i = 0; i < lines.length; i++) {            formattedText += '<p>' + lines[i] + '</p>';        }        // 将格式化后的文本插入到对应的p中        textArea.next('.output').html(formattedText);    });});

在这个例子中，我们假设每个textarea都有一个对应的输出p，它们都在同一个父元素下，并且输出p有一个类名为output。

问题2：如何在不使用jQuery的情况下实现相同的功能？

答案：如果不使用jQuery，可以使用原生JavaScript来实现相同的功能，以下是一个示例：

document.addEventListener('DOMContentLoaded', function() {    var textAreas = document.querySelectorAll('textarea');    textAreas.forEach(function(textArea) {        textArea.addEventListener('input', function() {            var lines = textArea.value.split('\n');            var formattedText = '';            for (var i = 0; i < lines.length; i++) {                formattedText += '<p>' + lines[i] + '</p>';            }            // 将格式化后的文本插入到对应的p中            var outputDiv = textArea.nextElementSibling;            outputDiv.innerHTML = formattedText;        });    });});

这个示例使用了querySelectorAll来选择所有的textarea元素，并为每个textarea添加了一个input事件**器，其他逻辑与jQuery版本相同。