javascript文本框内输入文字倒计数的方法


Posted in Javascript onFebruary 24, 2015

本文实例讲述了javascript文本框内输入文字倒计数的方法。分享给大家供大家参考。具体实现方法如下:

<html>

<head>

<title>文本框内输入文字倒计数效果</title>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

maxLen = 100; //定义用户可以输入的最多字数

function checkMaxInput(obj) {

if (obj.value.length > maxLen){ //如果输入的字数超过了限制

obj.value = obj.value.substring(0, maxLen); //就去掉多余的字

remLen.innerText = '您输入的内容超出了字数限制'

}

else{

remLen.innerText = '还剩下' + (maxLen - obj.value.length) + '字';//计算并显示剩余字数

}

}

//  End -->

</script>

</head>

<body>

<table border="1" width="40%" cellspacing="0" cellpadding="0" bordercolorlight="#000000" bgcolor="#808080" height="0">

 <tr>

  <td width="100%"><b><font color=ffffff>倒计数文本框</font></b></td>

 </tr>

 <tr>

  <td width="100%" height="110">

   <form name=tickform>

    <p align="center">

     <textarea name=msgbox rows=5 cols=31 onKeyDown="checkMaxInput(this)" onKeyUp="checkMaxInput(this)" style="background-color: #000000; color: #FFFFFF;overflow:auto"></textarea>

    </p>

   </td>

  </tr>

</form>

 <tr>

  <td width="100%">

   <font align="right" id=remLen><b></b></font>

  </td>

 </tr>

</table>

</body> 

</html>

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

Javascript 相关文章推荐
IE浏览器打印的页眉页脚设置解决方法
Dec 08 Javascript
jquery中使用ajax获取远程页面信息
Nov 13 Javascript
js调用activeX获取u盘序列号的代码
Nov 21 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
Dec 26 Javascript
浅析四种常见的Javascript声明循环变量的书写方式
Oct 14 Javascript
JQuery validate插件验证用户注册信息
May 11 Javascript
jQuery实现的自适应焦点图效果完整实例
Aug 24 Javascript
移动端滑动插件Swipe教程
Oct 16 Javascript
详解使用angular-cli发布i18n多国语言Angular应用
May 20 Javascript
echarts学习笔记之箱线图的分析与绘制详解
Nov 22 Javascript
vue组件开发之用户无限添加自定义填写表单的方法
Aug 28 Javascript
微信小程序swiper左右扩展各显示一半代码实例
Dec 05 Javascript
jQuery实现感应鼠标动画效果自动伸长的输入框实例
Feb 24 #Javascript
JS实现超过长度限制后自动跳转下一款文本框的方法
Feb 23 #Javascript
js仿土豆网带缩略图的焦点图片切换效果实现方法
Feb 23 #Javascript
JS实现仿中关村论坛评分后弹出提示效果的方法
Feb 23 #Javascript
jQuery+AJAX实现网页无刷新上传
Feb 22 #Javascript
AngularJS学习笔记之TodoMVC的分析
Feb 22 #Javascript
使用jquery组件qrcode生成二维码及应用指南
Feb 22 #Javascript
You might like
PHP统计数值数组中出现频率最多的10个数字的方法
2015/04/20 PHP
php生成酷炫的四个字符验证码
2016/04/22 PHP
thinkphp,onethink和thinkox中验证码不显示的解决方法分析
2016/06/06 PHP
Yii的Srbac插件用法详解
2016/07/14 PHP
摘自启点的main.js
2008/04/20 Javascript
鼠标放在图片上显示大图的JS代码
2013/03/26 Javascript
js函数模拟显示桌面.scf程序示例
2014/04/20 Javascript
JS合并数组的几种方法及优劣比较
2014/09/19 Javascript
JavaScript实现在标题栏上显示当前日期的方法
2015/03/19 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
2016/06/12 Javascript
bootstrap treeview 扩展addNode方法动态添加子节点的方法
2017/11/21 Javascript
快速解决处理后台返回json数据格式的问题
2018/08/07 Javascript
extract-text-webpack-plugin用法详解
2019/02/14 Javascript
vue+elementUI组件table实现前端分页功能
2020/11/15 Javascript
[01:01:43]EG vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
python实现微信自动回复功能
2018/04/11 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
django+xadmin+djcelery实现后台管理定时任务
2018/08/14 Python
python交换两个变量的值方法
2019/01/12 Python
Python数据可视化 pyecharts实现各种统计图表过程详解
2019/08/15 Python
Python对称的二叉树多种思路实现方法
2020/02/28 Python
Python的PIL库中getpixel方法的使用
2020/04/09 Python
Python pymysql模块安装并操作过程解析
2020/10/13 Python
记一次python 爬虫爬取深圳租房信息的过程及遇到的问题
2020/11/24 Python
Pycharm 设置默认解释器路径和编码格式的操作
2021/02/05 Python
阳光体育:Sunny Sports(购买露营和远足设备)
2018/08/07 全球购物
植村秀加拿大官网:Shu Uemura加拿大
2019/09/03 全球购物
小学教育毕业生自荐信
2013/11/18 职场文书
机电一体化专业推荐信
2013/12/03 职场文书
求职信怎么写范文
2014/05/26 职场文书
2014年预备党员学习新党章思想汇报
2014/09/15 职场文书
初中英语教师个人工作总结2015
2015/07/21 职场文书
小学英语新课改心得体会
2016/01/22 职场文书
如何制定一份可行的计划!
2019/06/21 职场文书
超级实用的公文标题大全!
2019/07/19 职场文书
JS中forEach()、map()、every()、some()和filter()的用法
2022/05/11 Javascript