利用 v-html 展示 str.replace(/\n|\r\n/g, '<br>') 数据 完美解决

背景 今天测试人员测试出来一个显示数据的页面,没有换行. 原因剖析 这个页面是从一个<textarea>的页面拿到的数据,存到数据库中后再返回来的. 1. 知道这点之后,就有了调查方向了:先查看从数据库取出来的数据是否有换行的标识,经过调试发现确实有(chrome换行符显示的是一个回车键的图标) 2. 既然有换行符,那么就是存取数据都是原模原样的,那么在显示的时候除了问题,那么是不是<span>的问题,经过一番调查,span确实不能直接处理换行符,需要替换为<br />

html5 textarea 写入换行的方法<pre> <textarea id="fwe" class="selmiao" cols="30" rows="10"></textarea> $('#fwe').val('wwe\nffwe');</pre>ps:必须用js的方法写入才可以获取在浏览器上写 或者按回车键 直接在html代码事先写好不行的<pre> var

需求:在textarea中输入文字,提交给后台后,后台输出在另一个页面,文字按原格式显示.   问题:如何还原输入框中的换行和空格? 兼容性:IE9以上.FF.chrome在换行处匹配/\n/               IE7-8在换行处先匹配/\r/,再匹配/\n/   html: <textarea name="" id="test_new_line" cols="30" rows="10"></tex

当在使用textarea的时候,有一次需求,需要做到自定义换行,而不是通过textarea定宽来自动换行,其实在html中可以直接通过<br/>来换行,同时也想到用\n来实现换行,其结果是根本不鸟你. <textarea cols="50" rows="5" id="textareaid">"adfsadfs<br/>fddsadfds \n dfadadf"</textarea>

1.需求: 获取textarea中的换行符,存到数据库中,并在取出时显示出换行操作 2.实践 2.1 发现可以取到换行符 "/n" ,并且可以存储到MySQL数据库中,并不需要特殊处理存储: 2.2 需要解决的只是将取回的字符在 html 文件中换行显示出来: 3.解决方案 只要将取回的字符中 "/n" 全部换为 <br/> 即可: 4.示例 可利用正则: $("#companyIntroductionForRead").html(c

在textarea里写的文本有换行,但是显示到页面后就不会自动换行,通过对数据分析发现textarea里的换行符是\n\r,然而HTML中的换行为<\br>解决办法有两种: 第一种:把文本显示到pre标签里 第二种:显示到页面后用JS把\n\r替换成<\br>

毕业设计进行ing~ 最近要想要实现一个站内邮箱,想要带换行地输出邮件主体内容. 这两天为了解决这个问题百度了好多东西,发现相关问题有很多记录,可能这确实是大多数初学者也碰到的问题.自己找了好多地方都没找到明确的解决方法. 其实解决了实在是很简单,但我真的几经周折才实现了自己想要的功能. 在这里希望自己可以尽可能详细地说明自己解决的过程,但愿能给所有寻找解决方法的朋友一个好的参考. 首先简单说一下问题和解决思路 问题1希望读进去的数据能保存为带换行的格式: 解决思路:在输入textarea表单的

删除数组指定的某个元素 var msg = " ";  //textarea  文本框输入的内容 var emp = [ ];   //定义一个数组,用来存msg分割好的内容 1. 首先可以给JS的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引,代码为: //封装移除方法 Array.prototype.remove = function(val) { var index = this.indexOf(val); if (index > -1) { this.sp

window.onload = function(){ document.getElementById('area').addEventListener('keydown',function(e){ if(e.keyCode!=13) return; e.preventDefault(); this.value += '.'; }); }; <textarea name="" id="area"></textarea> 开发过程中,从后台需要

vue实现复制内容到粘贴板   方案:找到textarea对象(input同样适用),获取焦点,选中textarea的所有内容,并调用document.execCommand("copy")   实现代码:   <template> <div> <textarea ref="letters"></textarea> <button @click="copyToClipboard('letters')&q

需求:判断当前textarea是否已经换行(这个换行有2种方式:1.不断输入文字直到超过指定宽度后自动换行:2.按了回车以后进行换行) 单纯的解决第二种换行很简单.网上提供了很多常规的解决方案. Demo:http://www.cnblogs.com/xrwang/archive/2011/04/27/LineBreakInJavascript.html 但是这是不完备的.是不能根本解决问题的! 因为很显然不能解决第一种问题.有人会说使用wrap="off"强制不能换行.那么麻烦你先了

在用vue的模板{{}}进行渲染文本时候,字符串换行不起作用,后使用ES6的模板字符串进行换行仍然不起作用,解决方法: <div>{{str}}</div> 可换为用v-html进行数据的渲染 <div v-html="str"></div> 从而换行轻易实现

textArea换行符转 <br/> textarea标签回车符是/n,在html里识别回车是<br/>,在存入数据库之前要进行转换成<br/>,在取出展示在html页面时才能显示换行. <tr> <td align=right width="20%" height="100">备注:</td> <td><textarea name="beiz" id=&q

解决办法: <textarea rows="5" style="height: auto;" ><?php //按行分割,然后每行输出后带上一个空行 $value_lines = explode( "\\r\\n", $value ); foreach( $value_lines as $value_line ){ echo $value_line; ?> <? } ?></textarea>

<html:textarea property="summary" style="word-wrap:break-word;word-break:break-all" rows="8"></html:textarea>

个人不太喜欢在页面做过多的逻辑处理,贴出java的处理方式 /** * Html转换为TextArea文本 * @return */ public static String HtmlToText(String str) { if (str == null) { return ""; }else if (str.length() == 0) { return ""; } str = str.replaceAll("<br />", &

上图可以实现文字文字靠左,换行直接回车就行,效果见下图

<style> pre {white-space: pre-wrap;} </style> //替换textare <pre class="feedback_question">${feedInfo.feedback_content}</pre> 提交用textarea标签,展示用pre标签,完美解决

<input type="textarea" @on-keypress="handlerMultiEnter"> handlerMultiEnter(e) { let code = e.keyCode; let ctrl = e.ctrlKey; let shift = e.shiftKey; let alt = e.altKey; if(code == '10' && ctrl && !shift &&

解决方法:在设置里面直接贴上代码: "vetur.format.defaultFormatter.html": "js-beautify-html", "vetur.format.defaultFormatterOptions": { "js-beautify-html": { "wrap_attributes": "auto", } }, 注: // 对属性进行换行. // - aut