Input文本框随着输入内容多少自动延伸的实现


Posted in Javascript onFebruary 15, 2017

实例如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<script language="javascript"> 
function checkLength(which) { 
  var oTextCount = document.getElementById("char");  
  iCount = which.value.replace(/[^/u0000-/u00ff]/g,"aa"); 
  oTextCount.innerHTML = "<font color=#FF0000>"+ iCount.length+"</font>"; 
  which.style.border = '1px dotted #FF0000'; 
which.size=iCount.length+2; 
} 
 </script> 
</head> 
<body> 
<input name="words" size="2"  onkeyup="checkLength(this)"/> 
  <span id="char">0</span>个字符 
</body> 
</html>

以上这篇Input文本框随着输入内容多少自动延伸的实现就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS类库Bindows1.3中的内存释放方式分析
Mar 08 Javascript
使用按钮控制以何种方式打开新窗口的属性介绍
Dec 17 Javascript
AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
Jun 06 Javascript
JavaScript设计模式之策略模式实例
Oct 10 Javascript
在AngularJS中使用AJAX的方法
Jun 17 Javascript
javascript实现动态表头及表列的展现方法
Jul 14 Javascript
通过设置CSS中的position属性来固定层的位置
Dec 14 Javascript
JavaScript计时器用法分析【setTimeout和clearTimeout】
Jan 18 Javascript
JavaScript轻松创建级联函数的方法示例
Feb 10 Javascript
js eval函数使用,js对象和字符串互转实例
Mar 06 Javascript
js实现时间轴自动排列效果
Mar 09 Javascript
原生JS实现的跳一跳小游戏完整实例
Jan 27 Javascript
利用Jquery实现几款漂亮实用的时间轴(附示例代码)
Feb 15 #Javascript
js记录点击某个按钮的次数-刷新次数为初始状态的实例
Feb 15 #Javascript
Canvas 绘制粒子动画背景
Feb 15 #Javascript
jQuery插件jquery.kxbdmarquee.js实现无缝滚动效果
Feb 15 #Javascript
js控制按钮,防止频繁点击响应的实例
Feb 15 #Javascript
js代码延迟一定时间后执行一个函数的实例
Feb 15 #Javascript
图文详解Javascript中的上下文和作用域
Feb 15 #Javascript
You might like
PHP性能优化 产生高度优化代码
2011/07/22 PHP
PHP+MYSQL会员系统的开发实例教程
2014/08/23 PHP
分享微信扫码支付开发遇到问题及解决方案-附Ecshop微信支付插件
2015/08/23 PHP
Apache启动报错No space left on device: AH00023该怎么解决
2015/10/16 PHP
php插入mysql数据返回id的方法
2018/05/31 PHP
jquery validate使用攻略 第四步
2010/07/01 Javascript
JavaScript类库D
2010/10/24 Javascript
checkbox选中与未选中判断示例
2014/08/04 Javascript
input输入框鼠标焦点提示信息
2015/03/17 Javascript
JavaScript生成福利彩票双色球号码
2015/05/15 Javascript
原生js实现数字字母混合验证码的简单实例
2015/12/10 Javascript
javascript实现九宫格相加数值相等
2020/05/28 Javascript
BOM系列第一篇之定时器setTimeout和setInterval
2016/08/17 Javascript
详解jQuery中的事件
2016/12/14 Javascript
JavaScript获取当前时间向前推三个月的方法示例
2017/02/04 Javascript
详解vantUI框架在vue项目中的应用踩坑
2018/12/06 Javascript
解决layui数据表格table的横向滚动条显示问题
2019/09/04 Javascript
python连接mongodb操作数据示例(mongodb数据库配置类)
2013/12/31 Python
python中的格式化输出用法总结
2016/07/28 Python
PyTorch的深度学习入门教程之构建神经网络
2019/06/27 Python
使用 Python 处理 JSON 格式的数据
2019/07/22 Python
Python实现一个带权无回置随机抽选函数的方法
2019/07/24 Python
详解解决Python memory error的问题(四种解决方案)
2019/08/08 Python
对Python 中矩阵或者数组相减的法则详解
2019/08/26 Python
Python带参数的装饰器运行原理解析
2020/06/09 Python
pytorch  网络参数 weight bias 初始化详解
2020/06/24 Python
Pop In A Box英国:Funko POP搪胶公仔
2019/05/27 全球购物
材料加工工程求职信
2014/02/19 职场文书
采购意向书范本
2014/03/31 职场文书
《第一朵杏花》教学反思
2014/04/16 职场文书
科技节口号
2014/06/19 职场文书
2014年车间工作总结
2014/11/21 职场文书
完美解决golang go get私有仓库的问题
2021/05/05 Golang
mysql数据库隔离级别详解
2022/06/16 MySQL
Redis主从复制操作和配置详情
2022/09/23 Redis
CSS使用SVG实现动态分布的圆环发散路径动画
2022/12/24 HTML / CSS