编程 Javascript

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程序设计有所帮助。

- Author -

代码家园

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

ext读取两种结构的xml的代码

Nov 05 Javascript

XENON基于JSON变种

Jul 27 Javascript

jquery ajax abort()的使用方法

Oct 28 Javascript

JavaScript实现url地址自动检测并添加URL链接示例代码

Nov 12 Javascript

解决JS请求服务器gbk文件乱码的问题

Oct 16 Javascript

详解jQuery中的deferred对象的使用（一）

May 27 Javascript

原生javascript 学习之js变量全面了解

Jul 14 Javascript

Javascript基础回顾之(一) 类型

Jan 31 Javascript

vue开发调试神器vue-devtools使用详解

Jul 13 Javascript

JavaScript常用事件介绍

Jan 21 Javascript

vue实现跳转接口push 转场动画示例

Nov 01 Javascript

vue绑定class的三种方法

Dec 24 Vue.js

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

网络资源

2006/10/09 PHP

shopex中集成的站长统计功能的代码简单分析

2011/08/11 PHP

php实现读取手机客户端浏览器的类

2015/01/09 PHP

Yii2实现增删改查后留在当前页的方法详解

2017/01/13 PHP

PHP实现驼峰样式字符串(首字母大写)转换成下划线样式字符串的方法示例

2017/08/10 PHP

PHP保留两位小数的几种方法

2019/07/24 PHP

PHP xpath提取网页数据内容代码解析

2020/07/16 PHP

如何在PHP中读写文件

2020/09/07 PHP

jquery 操作DOM案例代码分享

2012/04/05 Javascript

SOSO地图API使用(一)在地图上画圆实现思路与代码

2013/01/15 Javascript

JavaScript获取Url里的参数

2014/12/18 Javascript

JavaScript设计模式学习之“类式继承”

2015/03/12 Javascript

jQuery取消ajax请求的方法

2015/06/09 Javascript

js立即执行函数: (function ( ){})( ) 与 (function ( ){}( )) 有什么区别?

2015/11/18 Javascript

JS中对数组元素进行增删改移的方法总结

2016/12/15 Javascript

ES6中javascript实现函数绑定及类的事件绑定功能详解

2017/11/08 Javascript

Vue中的Vux配置指南

2017/12/08 Javascript

jQuery AJAX 方法success()后台传来的4种数据详解

2018/08/08 jQuery

微信小程序按钮去除边框线分享页面功能

2018/08/27 Javascript

微信小程序canvas绘制圆角base64图片的实现

2019/08/18 Javascript

js异步接口并发数量控制的方法示例

2020/11/22 Javascript

python抓取某汽车网数据解析html存入excel示例

2013/12/04 Python

Python中动态获取对象的属性和方法的教程

2015/04/09 Python

wxPython定时器wx.Timer简单应用实例

2015/06/03 Python

Python cookbook(数据结构与算法)通过公共键对字典列表排序算法示例

2018/03/15 Python

解决PyCharm的Python.exe已经停止工作的问题

2018/11/29 Python

Python数据可视化：箱线图多种库画法

2019/11/06 Python

解决Pycharm的项目目录突然消失的问题

2020/01/20 Python

Python3加密解密库Crypto的RSA加解密和签名/验签实现方法实例

2020/02/11 Python

秘书专业自荐信范文

2013/12/26 职场文书

应用英语专业自荐信

2014/01/26 职场文书

活动总结怎么写

2014/04/28 职场文书

金融专业毕业生自荐信

2014/06/26 职场文书

个人总结与自我评价

2015/02/14 职场文书

golang三种设计模式之简单工厂、方法工厂和抽象工厂

2022/04/10 Golang

利用 Python 的 Pandas和 NumPy 库来清理数据

2022/04/13 Python