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

 更新时间:2017年02月15日 09:43:14   投稿:jingxian  
下面小编就为大家带来一篇Input文本框随着输入内容多少自动延伸的实现。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

实例如下:

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

相关文章

  • JS跳出循环的5种方法总结(return、break、continue、throw等)

    JS跳出循环的5种方法总结(return、break、continue、throw等)

    想必大家都遇到过循环遍历时遇到满足条件的时候就跳出循环这样的需求,于是整理了一篇各种循环是如何结束的,这篇文章主要给大家介绍了关于JS跳出循环的5种方法,分别是return、break、continue、throw等的相关资料,需要的朋友可以参考下
    2024-05-05
  • js实现鼠标拖拽多选功能示例

    js实现鼠标拖拽多选功能示例

    本篇文章主要介绍了js实现鼠标拖拽多选功能示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • $.browser.msie 为空或不是对象问题的多种解决方法

    $.browser.msie 为空或不是对象问题的多种解决方法

    因为使用了jquery判断ie,所以使用了$.browser.msie但是在jquery 1.9以后的版本中不再支持$.browser而使用$.browser来替代
    2017-03-03
  • threejs使用JSON格式保存和加载整个场景分析

    threejs使用JSON格式保存和加载整个场景分析

    本文介绍了如何使用Three.js将三维场景保存为JSON格式,并加载整个场景,通过调用各个对象的.toJSON()方法,可以保存和加载立方体、球体、obj、glb等三维模型的顶点和材质数据,文章详细讲解了实现思路和代码样例,一起看看吧
    2024-11-11
  • JavaScript关于提高网站性能的几点建议(一)

    JavaScript关于提高网站性能的几点建议(一)

    这篇文章主要介绍了JavaScript关于提高网站性能的几点建议(一)的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-07-07
  • js实现简单的无缝轮播效果

    js实现简单的无缝轮播效果

    这篇文章主要为大家详细介绍了js实现简单的无缝轮播效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • JavaScript判断对象是否为数组

    JavaScript判断对象是否为数组

    这篇文章主要介绍了JavaScript判断对象是否为数组的三种方法,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • 如何使用ES6的class类继承来实现绚丽小球效果

    如何使用ES6的class类继承来实现绚丽小球效果

    JS是由ES(ECMAScript)、DOM(浏览器文档对象)、BOM(浏览器对象模型)组成,这篇文章主要给大家介绍了关于如何使用ES6的class类继承来实现绚丽小球效果的相关资料,需要的朋友可以参考下
    2021-06-06
  • 用javascript将数据导入Excel示例代码

    用javascript将数据导入Excel示例代码

    将数据导入Excel的方法有很多,本例介绍的这个是使用js来实现数据的导入,感兴趣的朋友可以了解下
    2014-09-09
  • 基于JavaScript的数据结构队列动画实现示例解析

    基于JavaScript的数据结构队列动画实现示例解析

    这篇文章主要介绍了基于JavaScript的数据结构队列动画实现示例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-08-08

最新评论