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

WordPress JQuery处理沙发头像

Jun 22 Javascript

jquery监控数据是否变化(修正版)

Apr 12 Javascript

鼠标滚轮改变图片大小的示例代码

Nov 20 Javascript

使用jQuery和PHP实现类似360功能开关效果

Feb 12 Javascript

javascript读取Xml文件做一个二级联动菜单示例

Mar 17 Javascript

jquery scroll()区分横向纵向滚动条的方法

Apr 04 Javascript

使用jquery实现放大镜效果

Sep 02 Javascript

JavaScript中最简洁的编码html字符串的方法

Oct 11 Javascript

AngularJS基础学习笔记之表达式

May 10 Javascript

Vue2.x中的父组件传递数据至子组件的方法

May 01 Javascript

浅谈jQuery框架Ajax常用选项

Jul 08 jQuery

实现jquery放大镜的两种方法

Feb 22 jQuery

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