在contenteditable div中,按下回车键时忽略换行符

时间:2015-09-18 18:03:22

标签: javascript php html css

当我按下返回键为帖子开始一个新行时,结果会自动忽略返回键。我想知道每当按下返回键时,最常用的输出方法是什么?

以下是我刚刚进行测试的演示。

php文件(linebreak.php)

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<div id="comment_box" contenteditable="true" autocomplete="off" spellcheck="false" placeholder="How do you feel about?"></div>
<div id="post_comment" class="comment_leg">Post</div>
<div name="commentsubmit"></div> 
<style>
#comment_box{
    text-align: center;
  background-color: white;

  /*position:relative;*/
  border: 1px solid orange;
  /*height:60px;*/
  width: 500px;
  padding: 10px;
  color:black;
  border-radius:3px;
  /*font-size:18px;*/
  display: inline-block;
  text-align: left;
  vertical-align: bottom;

  /*border-color:yellow;*/
}
.comment_leg{
cursor:pointer;
width:60px;
/*height:18px;*/
background-color: #ffcc99;
padding:5px;
text-align: center;
border-radius: 3px;
display:hide;
 vertical-align: bottom;
  display: inline-block;
}
</style>


<script>
$(function(){
        $("#post_comment").click(function(){
            var txt = $("#comment_box").text();
            if(txt){
                    $.post("commenttest.php", {txt: txt}, function(result){
                        $("div[name=commentsubmit]").prepend(result);
                        $("#comment_box").text('');
                    });
             }

        })
})

</script>

php文件(commenttest.php)

<?php
$comment=$_POST["txt"];
echo "<div style='color:orange'>".$comment."</div>"
?>

2 个答案:

答案 0 :(得分:1)

我回答这个是因为你的另一个问题被标记为重复。

<div>中的2个替换为

<form>
        <textarea name="comment_box" id="comment_box"></textarea>
        <input id="post_comment" class="comment_leg" type="submit" value="Post">
</form>

通过更改脚本以使用方法捕获textarea,可以捕获空间.val()

var txt = $("textarea#comment_box").val();
    if(txt){
        $.post("commenttest.php", {txt: txt}, function(result){
            $("div[name=commentsubmit]").prepend(result);
            $("textarea#comment_box").val();
        });
    }

要使用换行符打印,请在commenttest.php中插入此内容,然后在回显之前插入此内容,这是您尝试过但未通过重复发布或从答案中推荐的内容。

$comment = nl2br($comment);

答案 1 :(得分:0)

没有。那里<br />根本不存在。有\r\n。所以你需要使用:

$comment = nl2br($comment);

将所有新行转换为PHP代码中断。