编程 Javascript

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文本框随着输入内容多少自动延伸的实现就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

- Author -

jingxian

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

自己开发Dojo的建议框架

Sep 24 Javascript

JQuery textlimit 显示用户输入的字符数限制用户输入的字符数

May 14 Javascript

js实现数组去重、判断数组以及对象中的内容是否相同

Nov 29 Javascript

获取当前点击按钮的id用this.id实现

Mar 17 Javascript

jquery获取html元素的绝对位置和相对位置的方法

Jun 20 Javascript

JQuery Ajax WebService传递参数的简单实例

Nov 02 Javascript

js数组去重的hash方法

Dec 22 Javascript

ES6中Generator与异步操作实例分析

Mar 31 Javascript

windows下vue-cli导入bootstrap样式

Apr 25 Javascript

完美解决手机浏览器顶部下拉出现网页源或刷新的问题

Nov 30 Javascript

iview在vue-cli3如何按需加载的方法

Oct 31 Javascript

vue+element树组件实现树懒加载的过程详解

Oct 21 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

gd库图片下载类实现下载网页所有图片的php代码

2012/08/20 PHP

php采用ajax数据提交post与post常见方法总结

2014/11/10 PHP

PHP输出一个等腰三角形的方法

2015/05/12 PHP

tp5框架基于Ajax实现列表无刷新排序功能示例

2020/02/10 PHP

jquery动画4.升级版遮罩效果的图片走廊--带自动运行效果

2012/08/24 Javascript

javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板

2013/04/27 Javascript

将中国标准时间转换成标准格式的代码

2014/03/20 Javascript

深入理解js中的加载事件

2017/02/08 Javascript

Omi v1.0.2发布正式支持传递javascript表达式

2017/03/21 Javascript

理解 Node.js 事件驱动机制的原理

2017/08/16 Javascript

Three.js如何用轨迹球插件（trackball）增加对模型的交互功能详解

2017/09/25 Javascript

详解在vue-cli中使用路由

2017/09/25 Javascript

Ionic学习日记实现验证码倒计时

2018/02/08 Javascript

jQuery实现的简单图片轮播效果完整示例

2018/02/08 jQuery

dts文件中删除一个node或属性的操作方法

2018/08/05 Javascript

javascript canvas检测小球碰撞

2020/04/17 Javascript

three.js欧拉角和四元数的使用方法

2020/07/26 Javascript

[39:02]DOTA2亚洲邀请赛 3.31 小组赛 B组 Mineski vs VGJ.T

2018/04/01 DOTA

Python中if __name__ == "__main__"详细解释

2014/10/21 Python

Python中不同进制的语法及转换方法分析

2016/07/27 Python

Python 编码规范(Google Python Style Guide)

2018/05/05 Python

numpy matrix和array的乘和加实例

2018/06/28 Python

对python 判断数字是否小于0的方法详解

2019/01/26 Python

Python初学者常见错误详解

2019/07/02 Python

Django模板语言 Tags使用详解

2019/09/09 Python

运行python提示no module named sklearn的解决方法

2020/11/29 Python

css3实现input输入框颜色渐变发光效果代码

2014/04/02 HTML / CSS

css3 flex实现div内容水平垂直居中的几种方法

2020/03/27 HTML / CSS

JAVA和C++区别都有哪些

2015/03/30 面试题

如何开发一个JQuery插件

2016/07/28 面试题

学生会竞聘书范文

2014/03/31 职场文书

物资采购方案

2014/06/12 职场文书

干部四风问题整改措施思想汇报

2014/10/13 职场文书

大连导游词

2015/02/12 职场文书

《蚂蚁和蝈蝈》教学反思

2016/02/22 职场文书

Python opencv缺陷检测的实现及问题解决

2021/04/24 Python