JS如何实现文本框随文本的长度而增长

本文实例讲述了JS实现文本框随文本的长度而增长的方法，具体实现方法如下：

<!Doctype HTML PUBLIC "-//W3c//DTD Html 1.0 Transitional//EN">
<html>
<head>
<title>文本框随文本的宽度而增长</title>
</head>
<script type="text/javascript">
function changeInputlength(cursor)
{
var getcount=document.getElementById("countFont");
var getText=document.getElementById("text");
getcount.innerHTML='<font>第'+(parseInt(getText.value.length)+1)+'个字符</font>';
cursor.size=getText.value.length+2;
}
</script>
<body>
<input type="text" size="3" id="text" onkeydown="changeInputlength(this);"/>
<span id="countFont"></span>
</body>

希望本文所述对大家的javascript程序设计有所帮助。

赞 (0)

相关推荐

  • js简单实现让文本框内容逐个字的显示出来

    复制代码 代码如下: <script language="JavaScript"> <!-- function MArray() { this.length = MArray.arguments.length for (var i = 0; i < this.length; i++) this[i+1] = MArray.arguments[i]} var fArray = new MArray; fArray[0]="欢迎大家学习javascript

  • js如何实现点击标签文字，文字在文本框出现

    js如何实现点击标签文字，文字在文本框出现

    js实现点击标签文字,文字出现在文本框里,下面2种方法实现的功能略有不同,总体来说方法一功能更强大. 第一种方法:随意点击任何标签都会出现在文本框中,如何第二次点击标签,对应的文字就会在文本框中消失. <style>.c{ width:40px; height:25px; line-height:25px; text-align:left; margin:2px; float:left; font-size:12px; cursor:pointer }</style> <in

  • java实现文本框和文本区的输入输出

    在GUI中,常用文本框和文本区实现数据的输入和输出.如果采用文本区输入,通常另设一个数据输入完成按钮.当数据输入结束时,点击这个按钮.事件处理程序利用getText()方法从文本区中读取字符串信息.对于采用文本框作为输入的情况,最后输入的回车符可以激发输入完成事件,通常不用另设按钮.事件处理程序可以利用单词分析器分析出一个个数,再利用字符串转换数值方法,获得输入的数值.对于输出,程序先将数值转换成字符串,然后通过setText()方法将数据输出到文本框或文本区. [例 11-9]小应用程序设置一

  • javascript限制文本框输入值类型的方法

    本文实例讲述了javascript限制文本框输入值类型的方法.分享给大家供大家参考.具体分析如下: 要求:所有的文本框,只能输入数字和小数点,其他的符号一概不能输入: 重点是我希望在用户输入时就做限制,而不是提交时判断--也就是说如果用户在文本框内输入数字或小数点,可以正常输入:如果输入字母等非数字字符,则文本框会没有任何反应,不会显示输入的字符. <html> <body> <script> var s = "<input type=\"te

  • js显示文本框提示文字的方法

    本文实例讲述了js显示文本框提示文字的方法.分享给大家供大家参考.具体实现方法如下: <!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"> <

  • 如何用javascript计算文本框还能输入多少个字符

    下面代码超简单,不多说了,直接上代码. //输入计数 //count:能輸入的數據總量 function Calculation(v, count) { var span = $(v).next(); var valLength = $(v).val().length; if (valLength > count) { $(v).val($(v).val().substr(0, count)); valLength = count; } span.text("您已輸入" + va

  • 使用Jquery实现点击文字后变成文本框且可修改

    使用Jquery实现点击文字变为文本框效果,可对文本框文字进行修改. 1.点击文字变为文本框 2.文本框自动全选文字 3.对文本框内容进行修改 4.点击文本框以外的地方文本框再次变为修改后的文字 5.同步更新SQL数据库内容 Html部分代码 复制代码 代码如下: <table width="200"> <tr> <td><b>ID</b></td> <td><b>名称</b>&

  • JS如何实现文本框随文本的长度而增长

    本文实例讲述了JS实现文本框随文本的长度而增长的方法,具体实现方法如下: <!Doctype HTML PUBLIC "-//W3c//DTD Html 1.0 Transitional//EN"> <html> <head> <title>文本框随文本的宽度而增长</title> </head> <script type="text/javascript"> function ch

  • JS获取及设置TextArea或input文本框选择文本位置的方法

    本文实例讲述了JS获取及设置TextArea或input文本框选择文本位置的方法.分享给大家供大家参考.具体实现方法如下: function getPos(el) { var range, textRange, duplicate el.focus() if ( el.selectionStart ) return el.selectionStart else if ( document.selection ) { // IE range = document.selection.createR

  • JS清空多文本框、文本域示例代码

    点击按钮用Javascript清空页面上所有的文本框|文本域,代码如下: 复制代码 代码如下: <script type="text/javascript"> <!-- function cls(){ var sum=0; var t = document.getElementsByTagName("INPUT"); for (var i=0; i <t.length;i++){ if (t[i].type=='text'){ ++sum;

  • Javascript 文本框textarea高度随内容自适应增长收缩

    直接上代码: 方案一: 枫芸志 » 文本框textarea高度自适应增长/伸缩 textarea { height:100px; width: 300px; } 晴枫制作 http://jb51.net // 最小高度 var minHeight = 100; // 最大高度,超过则出现滚动条 var maxHeight = 300; function ResizeTextarea(){ var t = document.getElementById('txtContent'); h = t.s

  • js判断文本框剩余可输入字数的方法

    本文实例讲述了js判断文本框剩余可输入字数的方法.分享给大家供大家参考.具体如下: 目的:为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数 JS实现方法 复制代码 代码如下: <html>  <head runat="server">      <title></title>      <script type="text/javascript"> 

  • js统计录入文本框中字符的个数并加以限制不超过多少

    有些需求是为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,并且有些特殊的要求字数不超过多少,下面是实现: 复制代码 代码如下: <html> <head> <script src="jquery.js" type="text/javascript"></script> <script type="text/javascript"> function tjzs(){ var

  • js添加删除行和双击变文本框的脚本

    js添加删除行和双击变文本框---阿会楠练习作品 *{ font-size:12px; } #myTable{ background:#D5D5D5; color:#333333; } #myTable tr{ background:#F7F7F7; } #myTable tr th{ height:20px; padding:5px; } #myTable tr td{ padding:5px; } function $(obj){ return document.getElementById

  • JS与jQuery判断文本框还剩多少字符可以输入的方法

    本文实例讲述了JS与jQuery判断文本框还剩多少字符可以输入的方法.分享给大家供大家参考,具体如下: javascript部分: function $(id) { return document.getElementById(id); } var maxLen=255; function checkMaxInput(){ if($("summary").value.length>maxLen){ $("summary").value=$("summ

  • js 金额文本框实现代码

    案例1:回车实现Tab跳转. 响应文本框的onKeyDown事件,window.event.keyCode获得用户点击的keyCode. (*)keyCode和ASCII不是完全一致,主键盘的1和小键盘的1的ASCII一样,但是keyCode不一样.回车的keyCode为 13,Tab的keyCode为9. <body onkeydown="if(window.event.keyCode==13){window.event.keyCode=9;}"> 只有少数的键才能被替换

随机推荐