當給一個js變量賦值一個有換行的值得時候，就會報錯：
<!DOCTYPE HTML> <html> <head> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ var bad = "大家 早上好， 空氣 不錯哦"; $("#p1").html(bad); }); </script> </head> <body> <p id="p1"></p> <p id="p2"></p> <div> <textarea id="content"></textarea> </div> </body> </html>
比如這段代碼中，bad 變量賦值就出錯了。
什么時候會出現這種賦值呢，那就是從textarea的值存到數據庫之后，然后取出來直接賦值某個js變量的時候就會出現這種情況。
那就先從數據存入說起：
textarea雖不是富文本，但是可以多行顯示。比如這樣：
把textarea的值存入數據庫中某個字段，你會看着這個字段中存入的 只有輸入的這幾個字，
看不到其他html標記。但可以看出來 在回車的地方文字之間的距離寬一些，似乎有空格。
取值 賦值：
如果在js代碼中直接這樣賦值
var bad = <%=badContent%>
就會出現開頭那個錯誤的賦值，一個多行的文本賦值給一個js變量。
一個可行的辦法是這樣：在頁面上設置一個隱藏域，將后台取的值放到隱藏域中，然后用js/jquery 把這個值取出來，賦值到 js變量上。
（方法來源：http://bbs.csdn.net/topics/310152073）
然后將該js變量顯示到需要顯示textarea內容的html標簽處。用下面的方式模擬一下，如下所示：
<!DOCTYPE HTML> <html> <head> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script type="text/javascript"> function show() { var content = $("#content").val(); $("#p1").html(content); } </script> </head> <body> <p id="p1"></p> <p id="p2"></p> <div> <textarea id="content"></textarea> </div> <div> <button onclick="show()">顯示內容</button> </div> </body> </html>
內容雖然顯示但是沒按照預想的一樣顯示，沒有換行。 這是怎么回事？怎么辦呢？
我們看到的那個寬點的空白是空格嗎？不是。是textarea的換行符‘\n’ 而不是'\r\n'
知道了換行符是什么，那接下來就好辦了，把'\n'換成<br/>則就顯示出換行了。
注意使用正則替換可以把所有的換行都替換掉
<!DOCTYPE HTML> <html> <head> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script type="text/javascript"> function show() { var content = $("#content").val(); var contentformat = content.replace(/\n/g,'<br/>'); $("#p1").html(contentformat); } </script> </head> <body> <p id="p1"></p> <p id="p2"></p> <div> <textarea id="content"></textarea> </div> <div> <button onclick="show()">顯示內容</button> </div> </body> </html>
方法來源：http://www.cnblogs.com/xrwang/archive/2011/04/27/LineBreakInJavascript.html