textarea高度自适应问题
textarea中的文字如果过多,就会产生滚动条,一本分文本被遮盖住,不能看到所有的文本。
那么,如何才能让textarea的高度随输入内容多少,可以自动的改变高度呢?
解决思想:
1 利用contenteditable属性,让div变得可以编辑。
优点:方便,简介
缺点:提交数据不方便
2 利用js,动态改变textarea的高度
优点:提交数据很方便
缺点:要写好几段代码
我不禁提出质疑:在设计textarea这个标签的时候,专家们为何不给他一个可以高度自适应的属性呢?
谁能回答我?
textarea高度自适应问题的更多相关文章
- textarea高度自适应自动展开
在使用之前,推荐两个比较好的事件,分别是oninput和onpropertychange,IE9以下不兼容oninput.在textarea发生变化时,可以通过监听这两个事件来触发你需要的功能. te ...
- 实用小工具不定期合集(textarea 高度自适应、自动计算Y轴刻度、json转table)
1.textarea高度自适应 这个非常有用,但是网上的解决方案都不尽人意,话不多说,上代码. function auto (elem) { var minHeight = 30 var change ...
- 左边label随着右边textarea高度自适应
左边label随着右边自适应 近期项目中,有表单需求 默认展示两列,当内容多的时候,可以展示一列 左边列 <div> <label>备注</label> <s ...
- 实现textarea高度自适应内容,无滚动条
最近接触到一个很好用的js插件,可以实现textarea高度随内容增多而改变,并且不显示滚动条,推荐给大家: http://www.jacklmoore.com/autosize/
- textArea 高度自适应
<textarea name="apparatus" class="dhxTextArea" style="width:100%;height: ...
- textarea高度自适应,随着内容增加高度增加
$(function(){ $.fn.autoHeight = function(){ function autoHeight(elem){ ...
- css实现 textarea 高度自适应
此textarea非彼textarea ,有经验的老司机们应该知道html标签contenteditable这个属性. 利用此属性使当前的标签成为可以输入的状态,等同于输入框. 演示地址:https: ...
- textarea高度自适应解决方法
引入autosize.js <script src="./autosize.js"></script> autosize(document.getEleme ...
- textarea高度自适应
var tx=document.getElementById("tx"); tx.style.height=tx.scrollHeight+"px" tx.st ...
随机推荐
- SQL内连接-外连接join,left join,right join,full join
1.创建测试表test1及test2 SQL)); 表已创建. SQL)); 表已创建. ,'name1'); ,'name2'); ,'name3'); ,'name4'); ,'name5'); ...
- ASP.NET母版与内容页相对路径的问题
1. 图片问题 非常好解决 <img runat="server" src="~/images/ad468x60.gif" alt="" ...
- CSS兼容性常见问题总结
DIV+CSS设计IE6.IE7.FF 兼容性 DIV+CSS网页布局这是一种趋势,我也开始顺应这股趋势了,不过在使用DIV+CSS网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使 ...
- Android 平滑图片加载和缓存库 Glide 使用详解
在图片加载库烂大街的今天,选择一个适合自己使用的图片加载库已经成为了每一个Android开发者的必经之路.现在市面上知名的图片加载库有UIL,Picasso,Volley ImageLoader,Fr ...
- iOS应用拨打电话
方法一: 特点: 直接拨打, 不弹出提示. 并且, 拨打完以后, 留在通讯录中, 不返回到原来的应用. //拨打电话 - (void)callPhone:(NSString *)phoneNumber ...
- python中json的操作示例
先上一段示例 # -*- coding: cp936 -*- import json #构造一个示例数据,并打印成易读样式 j = {} j["userName"]="a ...
- fddd
<script language="JavaScript" type="text/javascript"> function exportChart ...
- 【设计模式:单例模式】使用单例模式加载properties文件
先准备测试程序: package org.jediael.util; import static org.junit.Assert.*; import org.junit.Test; public c ...
- Android 播放gif图片
Android的原生控件并不支持播放GIF格式的图片.我们都知道,在Android中如果想要显示一张图片,可以借助ImageView控件来完成,但是如果将一张GIF图片设置到ImageView里,它只 ...
- ThinkPHP框架一
1.1 框架的概念 框架其实就是可重用代码的集合,框架的代码是框架架构的代码,不是业务逻辑代码,框架代码保护类.方法.函数等等,框架代码按照一定的规则组合起来就形成了框架. 1.2 不使用框架开发的时 ...