javascript - 将textarea的文本复制到带有换行符的div中

标签 javascript jquery html textarea

我想在 jQuery 中使用 keyup() 制作一个简单的效果。我只希望当用户键入 textarea 时,用户键入的文本将复制到另一个名为 .content 的 div。当我在 textarea 中按 enter 时,会创建一个新行,但在我的 div 中,文本显示在同一行中。我的代码在下面,或者你可以在这里看到演示:http://jsfiddle.net/Pqygp/

    $('.content:not(.focus)').keyup(function(){					
        var value = $(this).val();
        var contentAttr = $(this).attr('name');
        
        $('.'+contentAttr+'').html(value);
    })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea name="mas" rows="15" class="content"></textarea>
    <p>&nbsp;</p>
    <div class="mas" >Texts Comes here</div>

最佳答案

在 div 的 CSS 中添加一个 white-space: pre-wrap 规则。

.mas {
    white-space: pre-wrap;
}

演示:http://jsfiddle.net/Pqygp/13/

关于javascript - 将textarea的文本复制到带有换行符的div中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18145682/

相关文章:

javascript - 如何使用 JavaScript/jQuery 更改内容?

javascript - 使用 JavaScript 将项目添加到 HTML 中的下拉列表

html - 带 CSS 的括号线

javascript - 在 jQuery UI 中堆叠 ListView

javascript - 是否可以通过上下文引用文档中的元素?

javascript - 如何在 Javascript/Jquery 中删除选定的文件

javascript - 使用 fetch 发出 POST 请求

jquery - 在鼠标悬停时添加内容

java - 使用先前使用 Selenium 2 选择器选择的 Jquery 选择元素

javascript - 如何减少 phonegap 应用程序加载外部页面的响应时间?