Javascript对网页输入框的字数限制

2016-02-20 01:01 10 1 收藏

每个人都希望每天都是开心的,不要因为一些琐事扰乱了心情还,闲暇的时间怎么打发,关注图老师可以让你学习更多的好东西,下面为大家推荐Javascript对网页输入框的字数限制,赶紧看过来吧!

【 tulaoshi.com - Web开发 】

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

js对输入框的字数限制,限制文本框输入的字符数,若达到数目则停止其输入!代码如下:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

01. !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
02.html xmlns="http://www.w3.org/1999/xhtml"
03.head
04.meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
05.title无标题文档/title
06.script type="text/javascript"
07.   
var textCounter=function (field,counter,maxlimit){
08.       
var charcnt = field.value.length;
09.       
if (charcnt maxlimit) {
10.           
field.value = field.value.substring(0, maxlimit);
11.       
}else {
12.           
document.getElementById(counter).innerHTML=charcnt;
13.       
}
14.   
}
15./script
16./head
17.body
18.pspan id="progressbar1"0/span/12/p
19.forminput type="text" id="maxcharfield"  size="34"/
20./form
21.script type="text/javascript"
22.   
document.getElementById("maxcharfield").onfocus = document.getElementById("maxcharfield").onkeydown = document.getElementById("maxcharfield").onkeyup = function(){
23.       
textCounter(this,'progressbar1',12);
24.   
}
25./script
26./body
27./html

来源:https://www.tulaoshi.com/n/20160220/1633064.html

延伸阅读
标签: Web开发
div.IPDiv{background:#ffffff;width:120;font-size:9pt;text-align:center;border:2 ridge threedshadow;border-right:inset threedhighlight;border-bottom:inset threedhighlight; } input.IPInput{width:24;font-size:9pt;text-align:center;border-width:0; }
标签: Web开发
div    label for="email"Email/label    input name="email" type="text" id="email" style="width:134px;" onfocus="if(this.value==’Input your email’)this.value=’’;"onblur=&qu...
表单是由许多细小的元素所组合而成的集合体,标题和输入框的排列方式有着重要的地位,标题要放在输入框的左侧还是上面?要靠左还是靠右?要怎么排列才能提高表单的完成率呢? 标题和输入框常见的排列方式 1. 放在输入框左边,而且靠左对齐 2. 放在输入框左边,但是靠右对齐 3. 放在输入框上面 4. 放在输入框里面 排列方式的比较...
    在网上我们常常看见一些单的输入框部分并不是我们常见的矩形框,而是一条细线,很多朋友对此很感兴趣。其实要实现这样的效果并不困难,我们只要用一段简短的CSS代码控制好表单输入框的样式即可。   示例如下:   请输入您的用户名: 下面我们就来看看这段实现效果的css代...
标签: Web开发
//* *// [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

经验教程

463

收藏

9
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部