textarea 是否换行的问题解决
需求:判断当前textarea是否已经换行(这个换行有2种方式:1.不断输入文字直到超过指定宽度后自动换行;2.按了回车以后进行换行)
单纯的解决第二种换行很简单。网上提供了很多常规的解决方案。
Demo:http://www.cnblogs.com/xrwang/archive/2011/04/27/LineBreakInJavascript.html
但是这是不完备的。是不能根本解决问题的!
因为很显然不能解决第一种问题.有人会说使用wrap="off"强制不能换行。那么麻烦你先了解下wrap:http://www.w3schools.com/tags/att_textarea_wrap.asp
当你不断输入确实不能换行了。但是横向文字在不断增加。这个应该不是用户可以接受的方式吧。
下面说说我的解决方案。
做的时候设置line-height 比如说设置为30.
现在我们把操作的textarea 叫做a
在需要校验的时候。动态创建一个textarea 叫做b 具备a的一切样式 .最好的方式是将a clone下来。获取到里面的value值。设置当前的height为line-height也就是 30.
现在简单了 判断b的scrollHeight 的值是否大于30 即可。大于30说明换行了。用scrollHeight我们同样可以判断当前的行数
textarea 是否换行的问题解决的更多相关文章
- angularjs中类似textarea的换行、空格处理
背景 今天测试人员测试出来一个显示数据的页面,没有换行. 原因剖析 这个页面是从一个<textarea>的页面拿到的数据,存到数据库中后再返回来的. 1. 知道这点之后,就有了调查方向了: ...
- html5 textarea 写入换行的方法
html5 textarea 写入换行的方法<pre> <textarea id="fwe" class="selmiao" cols=&qu ...
- 关于textarea中换行、回车、空格的识别与处理
需求:在textarea中输入文字,提交给后台后,后台输出在另一个页面,文字按原格式显示. 问题:如何还原输入框中的换行和空格? 兼容性:IE9以上.FF.chrome在换行处匹配/\n/ ...
- textarea内部换行实现
当在使用textarea的时候,有一次需求,需要做到自定义换行,而不是通过textarea定宽来自动换行,其实在html中可以直接通过<br/>来换行,同时也想到用\n来实现换行,其结果是 ...
- html textarea 获取换行
1.需求: 获取textarea中的换行符,存到数据库中,并在取出时显示出换行操作 2.实践 2.1 发现可以取到换行符 "/n" ,并且可以存储到MySQL数据库中,并不需要特殊 ...
- textarea文本换行和页面显示换行符
在textarea里写的文本有换行,但是显示到页面后就不会自动换行,通过对数据分析发现textarea里的换行符是\n\r,然而HTML中的换行为<\br>解决办法有两种: 第一种:把文本 ...
- textarea 带换行符保存数据与带换行符展示数据
毕业设计进行ing~ 最近要想要实现一个站内邮箱,想要带换行地输出邮件主体内容. 这两天为了解决这个问题百度了好多东西,发现相关问题有很多记录,可能这确实是大多数初学者也碰到的问题.自己找了好多地方都 ...
- js实现把textarea通过换行或者回车把多行数字分割成数组,并且去掉数组中空的值。
删除数组指定的某个元素 var msg = " "; //textarea 文本框输入的内容 var emp = [ ]; //定义一个数组,用来存msg分割好的内容 1. ...
- textarea使换行变顿号
window.onload = function(){ document.getElementById('area').addEventListener('keydown',function(e){ ...
随机推荐
- JavaScript sort()方法总结
sort() 方法用于对数组的元素进行排序. 语法:arrayObject.sort(sortby):参数sortby可选.规定排序顺序.必须是函数. 注:如果调用该方法时没有使用参数,将按字母顺序对 ...
- 1 PHP 5.3中的新特性
1 PHP 5.3中的新特性 1.1 支持命名空间 (Namespace) 毫无疑问,命名空间是PHP5.3所带来的最重要的新特性. 在PHP5.3中,则只需要指定不同的命名空间即可,命名空间的分隔符 ...
- Morse code(多模式串匹配)
链接:https://ac.nowcoder.com/acm/contest/3665/E来源:牛客网 题目描述 Morse code is a character encoding scheme u ...
- 计蒜客 王子救公主(DFS)
一天,蒜头君梦见自己当上了王子,但是不幸的是,自己的公主被可恶的巫婆抓走了.于是蒜头君动用全国的力量得知,自己的公主被巫婆抓进一个迷宫里面.由于全国只有蒜头君自己可以翻越迷宫外的城墙,蒜头君便自己一人 ...
- Java之多线程窗口卖票问题(Runnable)
/** * 例子:创建三个窗口卖票,总票数为100张.使用实现Runnable接口的方式 * 存在线程的安全问题,待解决. */class Window1 implements Runnable{ p ...
- Rails render collection 的魔法
都知道的, 在 Rails 的 View 里边渲染集合的时候, 会用到 render 方法参数的 collection 选项 1 <%= render partial: "produc ...
- java第三方工具包
--搜集于网络 1.Apache POI 处理office文档用到的2. IText PDF操作类库 3.Java Base64 Base64编码类库 4.Commons-lang 对应java sd ...
- ElasticSearch 分组查询
curl -XPOST 'localhost:9200/bank/_search?pretty' -d ' { "size": 0, "aggs": { &qu ...
- 文件操作符|-e|-M|-s|-A|_|-r -w $filename|stat|localtime|&|>>|<<
TTY:终端是一种字符型设备,它有多种类型,通常使用tty 来简称各种类型的终端设备 #!/usr/bin/perl use strict; use warnings; print "exi ...
- Opencv笔记(五)——把鼠标当画笔
学习目标: 学习使用 OpenCV 处理鼠标事件 学会使用函数cv2.setMouseCallback() 简单演示: 首先我们来创建一个鼠标事件回调函数,但鼠标事件发生是他就会被执 ...