textarea高度跟随文字高度而变化
html部分:
<textarea id="textarea">哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽</textarea>
js部分:
<!--textarea高度跟随文字高度而变化-->
<script>
function makeExpandingArea(el) {
var setStyle = function(el) {
el.style.height = 'auto';
el.style.height = el.scrollHeight + 'px';
// console.log(el.scrollHeight);
}
var delayedResize = function(el) {
window.setTimeout(function() {
setStyle(el)
},
0);
}
if (el.addEventListener) {
el.addEventListener('input',function() {
setStyle(el)
},false);
setStyle(el)
} else if (el.attachEvent) {
el.attachEvent('onpropertychange',function() {
setStyle(el)
});
setStyle(el)
}
if (window.VBArray && window.addEventListener) { //IE9
el.attachEvent("onkeydown",function() {
var key = window.event.keyCode;
if (key == 8 || key == 46) delayedResize(el);
});
el.attachEvent("oncut",function() {
delayedResize(el);
}); //处理粘贴
}
}
makeExpandingArea(textarea);
</script>
textarea高度跟随文字高度而变化的更多相关文章
- 小程序实现textarea随输入的文字行数变化高度自动增加
参考链接:https://blog.csdn.net/liuwengai/article/details/78987957 该实现方法是根据上面的链接改编为小程序的实现,代码如下: wxml: < ...
- textarea文本域的高度随内容的变化而变化
用css控制textarea文本域的高度随内容的变化而变化,不出现滚动条. CSS代码: 复制代码 代码如下: .t_area{ width:300px; overflow-y:visible } & ...
- iOS UITextView 高度随文字自己主动添加,并尾随键盘移动(二)
上节地址:http://blog.csdn.net/lwjok2007/article/details/47401293 接着上节我们来实现 输入框自己主动调节高度 首先,我们得知道,要推断是否该换行 ...
- iOS中动态计算不同颜色、字体的文字高度
在改项目bug的时候,有一个问题动态计算label的高度,前开发者竟然用字符串长度除以14.16这样的常量来计算是否换行,结果cell的高度问题非常严重. 因为label内容里有部分关键字是要另一种颜 ...
- javascript实现限定高度下文字随不同设备自适应改变字体大小至字数完全展示
function fontAutoMoreLine() { let textBox = document.getElementById("iconTxt"); let maxHei ...
- 使用contenteditable+div模拟textarea文本域实现高度自适应
使用contenteditable+div模拟textarea文本域实现高度自适应 开发过程中由于需要在发送消息的时候需要有一个可以高度自适应的文本域,一开始是使用textarea并搭配auto-si ...
- textarea 的最大高度以及最小高度
<script type="text/javascript"> $(function(){ $("#textarea3").textareaAuto ...
- iOS 【终极方案】精准获取webView内容高度,自适应高度
前言:是这样的,刚写完上一篇文章还没缓过神来,上一篇文章我还提到了,想和大家聊聊原生+H5如何无缝连接的故事.结果我朋友就给我发了两篇他的作品.他的做法也都有独到之处.好的文章都是这样,让你每次看都能 ...
- fullpage 单屏高度超过屏幕高度,实现单屏内可以滚动并解决手机端单屏高度不正确的问题
最近接触了好几次jquery.fullpage.js这个插件,实现整屏的滑动,效果很炫,用fullpage来实现也很简单,但是也碰到了一些问题和大家分享一下 1.单屏高度超过屏幕高度,实现单屏的滑动 ...
随机推荐
- 剑指offer三十九之平衡二叉树
一.题目 输入一棵二叉树,判断该二叉树是否是平衡二叉树. 二.思路 详解代码. 三.代码 public class Solution { //判断根节点左右子树的深度,高度差超过1,则不平衡 ...
- 【jQuery源码】tokenize方法
//得到由选择器生成的token对象的数组(下面的groups) //Sizzle的Token格式如下 :{value:'匹配到的字符串', type:'对应的Token类型', matches:'正 ...
- hibernate的配置文件,使用XML方式
<?xml version="1.0" encoding="UTF-8"?> <!-- 标准的XML文件的起始行,version='1.0'表 ...
- Redis持久化配置-AOF
redis的持久化有rdb和aof两种. rdb是记录一段时间内的操作,一般的配置是一段时间内操作超过多少次就持久化.aof可以实现每次操作都持久化. 这里我们使用aof. 配置方式,打开redis的 ...
- android学习-IPC机制之ACtivity绑定Service通信
bindService获得Service的binder对象对服务进行操作 Binder通信过程类似于TCP/IP服务连接过程binder四大架构Server(服务器),Client(客户端),Serv ...
- Mahout实战---运行第一个推荐引擎
创建输入 创建intro.csv文件,内容如下 1,101,5.0 1,102,3.0 1,103,2.5 2,101,2.0 2,102,2.5 2,103,5.0 2,104,2.0 3,101, ...
- kafka-spark streaming (一)
Kafka-spark streaming 1.安装包 kafka安装需要zookeeper.jdk. 官网下载最新的: https://kafka.apache.org/downloads http ...
- NodeJS之 Express框架 app.use(express.static)
一 .设置静态文件目录 语法如下: app.use(express.static(_dirname + '/public')); //设置静态文件目录 注: 将静态文件目录设置为项目根目录 + ‘/p ...
- java反射实现接口重试
工具类: import java.lang.reflect.Method; public class RetryUtil { private static ThreadLocal<Integer ...
- javascript中字符串常用操作总结
String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟其他语言有些不 ...