获取实时预览到php的文本并进行转换
获取实时预览到php的文本并进行转换
提问于 2020-07-05 13:06:45
我已经创建了这个实时预览功能，它非常完美，但是新的行等等并没有显示出来，而且我还有一个bb代码功能，我可以通过我的文本。因此，textarea [b]Hello world[/b]中的文本是Hello
到目前为止，这是我的代码：
<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输出。
回答 2
Stack Overflow用户
发布于 2020-07-05 13:58:28
在div样式中添加“空格:预行”将有效。这是编辑过的代码。现在它起作用了..。
<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>
Stack Overflow用户
发布于 2020-07-05 14:49:12
要向php发送带有新行的数据，可以使用nl2br()函数。
例如，在您将数据发布到php之后，当您将数据分配给php变量时，您可以简单地将其添加到php中.
$comment = nl2br($_POST"WPcomment")；
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62741088
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号