如何使用jQuery與換行符保存textarea的文本？

我有一個用戶輸入文本的文本區域。我想以用戶輸入的方式檢索文本，包括自動換行的新換行符。如何獲得textarea的文本使用jQuery保留新行字符？如何使用jQuery與換行符保存textarea的文本？

2010-05-31 Elangovan

$（'textarea'）。val（）是否工作？你在做什麼而不是換行符？ – hwiechers 2010-05-31 05:58:12

它不起作用。我照耀處文本喜如何是嗎？我正在收到「hihowareyou？」 – Elangovan 2010-05-31 06:01:36

@hwiechers的建議，工作正常，我......除非你想保留自動換‘新線’，這將是不可能的。 – Alconja 2010-05-31 06:01:41

鑑於您的編輯，其將是相當困難的，如果不是不可能準確地做到這一點。問題是自動換行實際上並沒有插入任何換行符，它只是瀏覽器在多行中呈現一個字符串......所以我能想到的唯一方法就是嘗試&編寫一些代碼來估計換行符的位置根據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.

然而，這是一個很大的如果 S，我不知道該怎麼好，這將在所有瀏覽器的工作（我測試它出現在Firefox 3.6中工作&）...

而且請注意，如果您確實按照這條路線行事，那麼我的文字包裝代碼是非常基本的，並且實際上保證不會與瀏覽器在所有情況下所做的相匹配，因此您可能需要根據您的確切要求進行擴展。例如，長度超過cols的單詞可能會被firefox分割，但不會被我的代碼分割。

來源

2010-05-31 06:55:53 Alconja

您需要用br標籤替換「\ n」或在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; 
    }); 
});

我希望這有助於。

來源

2010-05-31 06:34:03 ricecake5

在我看來，這比Alconja給出的解決方案要好得多。 – 2013-09-28 00:29:48

I want to keep automatically wrapped newlines.

你不能這樣做，因爲沒有換行字符那裏。 Textarea控件正在爲你做視覺包裝。有沒有新的生產線，除非你鍵入它們。

來源

2010-05-31 06:37:18 Strelok

如何使用jQuery與換行符保存textarea的文本？

回答

相關問題