编程 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 相关文章推荐

基于jquery用于查询操作的实现代码

May 10 Javascript

理解Javascript_08_函数对象

Oct 15 Javascript

JQuery页面图片切换和新闻列表滚动效果的具体实现

Sep 26 Javascript

浅谈node.js中async异步编程

Oct 22 Javascript

详解JavaScript的表达式与运算符

Nov 30 Javascript

手机端转换rem适应

Apr 01 Javascript

使用JS获取SessionStorage的值

Jan 12 Javascript

Vue中对拿到的数据进行A-Z排序的实例

Sep 25 Javascript

小程序自定义单页面、全局导航栏的实现代码

Mar 15 Javascript

JavaScript实现省份城市的三级联动

Feb 11 Javascript

Vue实现返回顶部按钮实例代码

Oct 21 Javascript

用几道面试题来看JavaScript执行机制

Apr 30 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