Textarea值不保留变量的换行符

Question

我有一个textarea需要在提交后保留提交的值和格式，但由于某种原因\\ n似乎没有从变量php变量传递。

$text = '1\n2\n3';

echo '<script>
var text = "'.$text.'";
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>'

变量从php传递给JS。 当我回显变量时，我得到了预期的结果：

1\n2\n3

将变量赋值给textarea值时，结果为：

123

代替：

1
2
3

现在，如果我将js更改为以下内容，我会在新行上获得每个数字的预期结果。

$("textarea").val("1\n2\n3");

有谁知道为什么php变量没有传递\\ n返回JS？

Answer 1

使用json编码应该以JS将理解的方式逃避您的换行符。

$text = json_encode('1\n2\n3');

echo '<script>
var text = JSON.parse("'.$text.'");
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>'

Answer 2

你应该用它。

    <script   src="https://code.jquery.com/jquery-3.1.1.min.js"   integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="   crossorigin="anonymous"></script>

<textarea rows="4" cols="50">
</textarea>


<?php

$text = '1\n2\n3';

echo '<script>
var text = "'.$text.'";
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>'
?>

Answer 3

问题是你期望浏览器Javascript能够理解PHP的“\\ n”字符。 那样不行。 此外，您的代码使用单引号来表示换行符。 PHP要求您使用双引号来表示换行特殊字符。

至少有两种方法可以解决这个问题。

第一种是使用PHP的nl2br（）函数。 在这种情况下，您的代码可以重写为：

$text = "1\n2\n3"; //notice the use of double quotes.

echo '<script>
var text = "'. nl2br($text).'";
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>'

第二种方法是使用HTML
直接在变量声明中标记。 这样可以避免使用PHP的nl2br（）函数。

$text = '1<br>n2<br>n3';

echo '<script>
var text = "'.$text.'";
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>'

这两种方法都应该有效。

Answer 4

$text = '1\n2\n3';

更改为双引号：

$text = "1\n2\n3";

在PHP双引号“和单引号”不解析相等。对于我们需要使用双引号的东西，像这样。

对于：$ text =“\\ n1 \\ n2 \\ n3 \\ n”;

源页面视图将是：

<script>
var text = "
1
2
3
";
$( document ).ready(function() {
    $("textarea").attr("placeholder","1) Start Each Comment On A New Line...");
    $("textarea").val(text);
});

</script>