我已经创建了这个实时预览的东西，工作很完美，但新的线条等不显示，而且我有一个BB代码功能，我会我的文本通过。 因此文本区域[b]Hello world[/b]中文本是Hello world
这是我到目前为止的代码:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<textarea name="WPcomment" id="WPComment" placeholder="Legg til tekst..."></textarea>
<br>
<input type="button" class="button" name="answer" value="Live-preview" onclick="showDiv()" />
<div style="display:none;" id="prevCom"></div>
</body>
<script type="text/javascript">
var wpcomment = document.getElementById('WPComment');
wpcomment.onkeyup = wpcomment.onkeypress = function(){
document.getElementById('prevCom').innerHTML = this.value;
}
function showDiv() {
document.getElementById('prevCom').style.display = "block";
}
</script>
</html>
jsfiddle:https://jsfiddle.net/mhp57cno/
当我从数据库输出文本时，我使用的php是:
$htmltext = htmlspecialchars($htmltext);
$htmltext = showBBcodes($htmltext);
echo $htmltext;
我主要想要的是#prevcom中的文本，作为上面的$htmltext输出
在div样式中添加“white-space:pre-line”就可以了。 下面是编辑后的代码。 现在起作用了。。。。
null
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<textarea name="WPcomment" id="WPComment" placeholder="Legg til tekst..."></textarea>
<br>
<input type="button" class="button" name="answer" value="Live-preview" onclick="showDiv()" />
<div style="white-space: pre-line; display:none;" id="prevCom" ></div>
</body>
<script type="text/javascript">
var wpcomment = document.getElementById('WPComment');
wpcomment.onkeyup = wpcomment.onkeypress = function(){
document.getElementById('prevCom').innerHTML = this.value;
}
function showDiv() {
document.getElementById('prevCom').style.display = "block";
}
</script>
</html>
要将带有新行的数据发送到php，可以使用nl2br()函数。
例如，在将数据发布到php并将该数据分配给php变量之后，您可以简单地在php中添加该变量。。。
$comment=nl2br($_post[“wpcomment”])；
