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 相关文章推荐
Javascript 篱式条件判断
Aug 22 Javascript
不用写JS也能使用EXTJS视频演示
Dec 29 Javascript
JS实现金额转换(将输入的阿拉伯数字)转换成中文的实现代码
Sep 30 Javascript
jquery实现非叠加式的搜索框提示效果
Jan 07 Javascript
jquery实现动静态条形统计图
Aug 17 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
Bootstrap carousel轮转图的使用实例详解
May 17 Javascript
js实现页面a向页面b传参的方法
May 29 Javascript
vue插件tab选项卡使用小结
Oct 27 Javascript
微信小程序 刷新上拉下拉不会断详细介绍
May 11 Javascript
vue devtools的安装与使用教程
Aug 08 Javascript
JavaScript实现浏览器网页自动滚动并点击的示例代码
Dec 05 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
session 的生命周期是多长
2006/10/09 PHP
PHP 地址栏信息的获取代码
2009/01/07 PHP
php学习笔记之面向对象编程
2012/12/29 PHP
详解Window7 下开发php扩展
2015/12/31 PHP
PHP array_key_exists检查键名或索引是否存在于数组中的实现方法
2016/06/13 PHP
js Html结构转字符串形式显示代码
2011/11/15 Javascript
JavaScript开发人员的10个关键习惯小结
2014/12/05 Javascript
JavaScript实现带缓冲效果的随屏滚动漂浮广告代码
2015/11/06 Javascript
学习JavaScript设计模式(接口)
2015/11/26 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
2016/03/05 Javascript
JS中JSON对象和String之间的互转及处理技巧
2016/04/06 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
js多个物体运动功能实例分析
2016/12/20 Javascript
javascript 跨域问题以及解决办法
2017/07/17 Javascript
Node.js 使用流实现读写同步边读边写功能
2017/09/11 Javascript
JavaScript 跨域之POST实现方法
2018/05/07 Javascript
详解微信小程序缓存--缓存时效性
2019/05/02 Javascript
微信小程序实现拼图小游戏
2020/10/22 Javascript
[02:31]《DAC最前线》之选手酒店现场花絮
2015/01/30 DOTA
[03:06]3分钟带你回顾DOTA2完美盛典&完美大师赛
2017/12/06 DOTA
python Django连接MySQL数据库做增删改查
2013/11/07 Python
使用Python脚本对Linux服务器进行监控的教程
2015/04/02 Python
Python中装饰器学习总结
2018/02/10 Python
python发送邮件脚本
2018/05/22 Python
Python图像处理二值化方法实例汇总
2020/07/24 Python
Django限制API访问频率常用方法解析
2020/10/12 Python
python输出国际象棋棋盘的实例分享
2020/11/26 Python
利用CSS3把图片变成灰色模式的实例代码
2016/09/06 HTML / CSS
移动端html5模拟长按事件的实现方法
2018/09/30 HTML / CSS
酒店前厅员工辞职信
2014/01/08 职场文书
个人收入证明范本
2014/01/12 职场文书
写给父母的感谢信
2015/01/22 职场文书
客户付款通知书
2015/04/23 职场文书
2016年社区创先争优活动总结
2016/04/05 职场文书
Python调用腾讯API实现人脸身份证比对功能
2022/04/04 Python
MySQL事务的隔离级别详情
2022/07/15 MySQL