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 Distilled 基础知识与函数
Apr 07 Javascript
JS 各种网页尺寸判断实例方法
Apr 18 Javascript
JQuery 操作/获取table具体代码
Jun 13 Javascript
深入理解javascript动态插入技术
Nov 12 Javascript
浅析webapp框架AngularUI的demo
Dec 21 Javascript
Jquery动态添加输入框的方法
May 29 Javascript
详解Bootstrap插件
Apr 25 Javascript
Node.js 使用命令行工具检查更新
Jun 08 Javascript
Angular.js中数组操作的方法教程
Jul 31 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
Nov 22 Javascript
ajax请求+vue.js渲染+页面加载的示例
Feb 11 Javascript
从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法
Sep 18 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 join函数应用
2011/05/04 PHP
编写php应用程序实现摘要式身份验证的方法详解
2013/06/08 PHP
PHP exif扩展方法开启详解
2014/07/28 PHP
Yii2.0框架模型多表关联查询示例
2019/07/18 PHP
JQUERY CHECKBOX全选,取消全选,反选方法三
2008/08/30 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
jQuery设置div一直在页面顶部显示的方法
2013/10/24 Javascript
javascript实现label标签跳出循环操作
2016/03/06 Javascript
jQuery选择器总结之常用元素查找方法
2016/08/04 Javascript
用JS中split方法实现彩色文字背景效果实例
2016/08/24 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
2016/09/08 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
2017/03/09 Javascript
常用的9个JavaScript图表库详解
2017/12/19 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
2018/07/06 Javascript
谈谈JavaScript中super(props)的重要性
2019/02/12 Javascript
React优化子组件render的使用
2019/05/12 Javascript
微信小程序返回箭头跳转到指定页面实例解析
2019/10/08 Javascript
vue动画—通过钩子函数实现半场动画操作
2020/08/09 Javascript
javascript实现倒计时关闭广告
2021/02/09 Javascript
Python装饰器decorator用法实例
2014/11/10 Python
Python两个内置函数 locals 和globals(学习笔记)
2016/08/28 Python
python 将数据保存为excel的xls格式(实例讲解)
2018/05/03 Python
Python获取系统所有进程PID及进程名称的方法示例
2018/05/24 Python
python实现用类读取文件数据并计算矩形面积
2020/01/18 Python
Python中zip()函数的解释和可视化(实例详解)
2020/02/16 Python
python GUI库图形界面开发之PyQt5滑块条控件QSlider详细使用方法与实例
2020/02/28 Python
python代码区分大小写吗
2020/06/17 Python
女性时尚在线:IVRose
2019/02/23 全球购物
国培计划培训感言
2014/03/11 职场文书
学习考察心得体会
2014/09/04 职场文书
正风肃纪剖析材料
2014/09/30 职场文书
见习报告的格式
2014/10/31 职场文书
酒店工程部经理岗位职责
2015/04/09 职场文书
大学迎新生的欢迎词
2019/06/25 职场文书
创业计划书之孕婴生活馆
2019/11/11 职场文书
Apache Calcite 实现方言转换的代码
2021/04/24 Servers