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 相关文章推荐
JavaScript 加号(+)运算符号
Dec 06 Javascript
JavaScript 页面编码与浏览器类型判断代码
Jun 03 Javascript
JS中表单的使用小结
Jan 11 Javascript
jQuery 回车事件enter使用示例
Feb 18 Javascript
javascript中caller和callee详解
Aug 10 Javascript
uploadify多文件上传参数设置技巧
Nov 16 Javascript
JavaScript绑定事件监听函数的通用方法
May 14 Javascript
用js实现简单算法的实例代码
Sep 24 Javascript
基于jQuery代码实现圆形菜单展开收缩效果
Feb 13 Javascript
JavaScrip数组删除特定元素的几种方法总结
Sep 06 Javascript
js使用ajax传值给后台,后台返回字符串处理方法
Aug 08 Javascript
TypeScript 使用 Tuple Union 声明函数重载
Apr 07 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&amp;mysql(四)
2006/10/09 PHP
codeigniter中测试通过的分页类示例
2014/04/17 PHP
PHP strip_tags保留多个HTML标签的方法
2016/05/22 PHP
PHP调用接口用post方法传送json数据的实例
2018/05/31 PHP
AJAX异步从优酷专辑中采集所有视频及信息(JavaScript代码)
2010/11/20 Javascript
小试JQuery的AutoComplete插件
2011/05/04 Javascript
JavaScript插入动态样式实现代码
2012/02/22 Javascript
js获取本机的外网/广域网ip地址完整源码
2013/08/12 Javascript
js实现点击图片改变页面背景图的方法
2015/02/28 Javascript
AngularJS身份验证的方法
2016/02/17 Javascript
分享12个非常实用的JavaScript小技巧
2016/05/11 Javascript
设置jQueryUI DatePicker默认语言为中文
2016/06/04 Javascript
简单分析javascript中的函数
2016/09/10 Javascript
JavaScript中绑定事件的三种方式及去除绑定
2016/11/05 Javascript
JS实现的input选择图片本地预览功能示例
2018/08/29 Javascript
配置一个vue3.0项目的完整步骤
2019/04/26 Javascript
详解JS判断页面是在手机端还是在PC端打开的方法
2019/04/26 Javascript
bootstrap table.js动态填充单元格数据的多种方法
2019/07/18 Javascript
VUE实现强制渲染,强制更新
2019/10/29 Javascript
Vue.js watch监视属性知识点总结
2019/11/11 Javascript
Python MD5文件生成码
2009/01/12 Python
python操作MySQL数据库具体方法
2013/10/28 Python
从Python程序中访问Java类的简单示例
2015/04/20 Python
通过Python爬虫代理IP快速增加博客阅读量
2016/12/14 Python
python文件特定行插入和替换实例详解
2017/07/12 Python
python距离测量的方法
2018/03/06 Python
python3 requests中使用ip代理池随机生成ip的实例
2018/05/07 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
什么是Python中的匿名函数
2020/06/02 Python
css3实现背景图片拉伸效果像桌面壁纸一样
2013/08/19 HTML / CSS
阿迪达斯墨西哥官方网站:adidas墨西哥
2017/11/03 全球购物
电子商务专业毕业生工作推荐信
2013/11/17 职场文书
美术指导助理求职信
2014/04/20 职场文书
青春励志演讲稿
2014/04/29 职场文书
员工考勤管理制度
2015/08/06 职场文书
Nginx+Windows搭建域名访问环境的操作方法
2022/03/17 Servers