Question

我有一个用户输入文字的文字区域。我想检索用户输入的文本，包括自动换行的新行字符。如何使用保存换行符的jQuery获取textarea的文本？

Answer 1

您需要将“\ n”替换为br标签，或者将内容包装在pre中以查看下一行。

以下是示例代码：

假设您的页面标记如下：

<div id="res"></div>
<textarea id="txtarea"></textarea>
<button id="btn">go</button>

然后这是jquery代码：

$(document).ready(function() {
    var btn = $('#btn');
    var txtarea = $('#txtarea');
    var result = $('#res');
    btn.click(function() {
        var val = txtarea.val().replace(/\n/g, '<br/>');
        result.html(val);
        return false;
    });
});

我希望这会有所帮助。

Answer 2

I want to keep automatically wrapped newlines.

你不能这样做，因为那里没有换行符。 Textarea控件正在为您进行视觉包装。没有换行，除非你输入。

Answer 3

鉴于你的编辑，如果不是不可能的话，它将变得相当困难。问题是自动换行实际上并没有插入任何换行符，只是浏览器将一个字符串渲染成多行...所以我能想到的唯一方法是尝试＆amp;编写一些代码，根据textarea的宽度估算换行符的呈现位置并手动插入。

因此，记住如果您的文字区域没有CSS宽度设置和，您使用cols="xx"属性和你使用固定宽度字体和你总是有滚动条显示（这会影响textarea根据cols呈现的宽度），那么应该能够通过这样的方式计算在浏览器自动包装之前在一行上显示的单词数量：

//Based off <textarea id="text" cols="50" rows="5" style="overflow: scroll">This is a test sentence, with no newline characters in it, but with an automatically wrapped sentence that spans three lines.</textarea>
var words = $("#text").val().split(" ");
var cols = $("#text").attr("cols");
var text = "";
var lineLength = 0;
for (var i = 0; i < words.length; i++) {
    var word = words[i];
    if ((lineLength + word.length + 1) > cols) {
        text += "\n";
        lineLength = 0;
    } else if (lineLength > 0) {
        text += " ";
        lineLength++;
    }
    text += word;
    lineLength += word.length;
}
alert(text);
//Alerts:
//This is a test sentence, with no newline
//characters in it, but with an automatically
//wrapped sentence that spans three lines.

然而，这很多如果，并且我不知道这对所有浏览器的效果如何（我测试了它并且它似乎在Firefox 3.6中工作）......

另请注意，如果您沿着这条路走下去，那我的自动换行代码非常简陋，几乎可以保证不会与浏览器在所有情况下的操作相匹配，因此您可能需要根据您的具体情况进行扩展。要求是。例如，长度超过cols长度的单词会被firefox拆分，但不会被我的代码拆分。

如何使用jQuery获取textarea的文本并保留换行符？

3 个答案: