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 相关文章推荐
使用原生JS实现弹出层特效
Dec 22 Javascript
基于javascript实现的搜索时自动提示功能
Dec 26 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
Jun 06 Javascript
基于jQuery实现的旋转彩圈实例
Jun 26 Javascript
实例讲解js验证表单项是否为空的方法
Jan 09 Javascript
分享jQuery插件的学习笔记
Jan 14 Javascript
详细谈谈javascript的对象
Jul 31 Javascript
js实现精确到毫秒的倒计时效果
Aug 05 Javascript
浅谈$_FILES数组为空的原因
Feb 16 Javascript
jquery实现表单获取短信验证码代码
Mar 13 Javascript
vue路由传参页面刷新参数丢失问题解决方案
Oct 08 Javascript
JS实现悬浮球只在一侧滑动并且是横屏状态下
Aug 19 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性能的原理介绍
2012/09/05 PHP
浅谈PHP的$_SERVER[SERVER_NAME]
2017/02/04 PHP
PHP实现QQ登录的开原理和实现过程
2018/02/04 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
Jquery多选框互相内容交换的实例代码
2013/07/04 Javascript
js实现两个值相加alert出来精确到指定位
2013/09/25 Javascript
JS获得选取checkbox整行数据的方法
2015/01/28 Javascript
JavaScript实现LI列表数据绑定的方法
2015/08/04 Javascript
easyui-edatagrid.js实现回车键结束编辑功能的实例
2017/04/12 Javascript
Vue.js中轻松解决v-for执行出错的三个方案
2017/06/09 Javascript
详解.vue文件中监听input输入事件(oninput)
2017/09/19 Javascript
Vue 源码分析之 Observer实现过程
2018/03/29 Javascript
js中this的指向问题归纳总结
2018/11/28 Javascript
vue写h5页面的方法总结
2019/02/12 Javascript
Nuxt.js实现一个SSR的前端博客的示例代码
2019/09/06 Javascript
使用axios发送post请求,将JSON数据改为form类型的示例
2019/10/31 Javascript
python 提取文件的小程序
2009/07/29 Python
Python中针对函数处理的特殊方法
2014/03/06 Python
Python实现提取文章摘要的方法
2015/04/21 Python
编写Python脚本来获取mp3文件tag信息的教程
2015/05/04 Python
判断网页编码的方法python版
2016/08/12 Python
python3+requests接口自动化session操作方法
2018/10/13 Python
python实现贪吃蛇游戏
2020/03/21 Python
Laravel+Dingo/Api 自定义响应的实现
2019/02/17 Python
Python快速转换numpy数组中Nan和Inf的方法实例说明
2019/02/21 Python
python如何利用paramiko执行服务器命令
2020/11/07 Python
英国独特的时尚和生活方式品牌:JOY
2018/03/17 全球购物
英国床垫和床架购物网站:Bedman
2019/11/04 全球购物
DeinDesign德国:设计自己的手机壳
2019/12/14 全球购物
中秋节主持词
2014/04/02 职场文书
个人求职信格式范文
2015/03/20 职场文书
员工旷工检讨书
2015/08/15 职场文书
七年级作文(600字3篇)
2019/09/24 职场文书
Oracle使用别名的好处
2022/04/19 Oracle
Python 避免字典和元组的多重嵌套问题
2022/07/15 Python
Python sklearn分类决策树方法详解
2022/09/23 Python