主页 / 网络编程 /

javascript文本框内输入文字倒计数的方法

网络编程 2021-07-04 21:47www.168986.cn编程入门
这篇文章主要介绍了javascript文本框内输入文字倒计数的方法,涉及javascript针对键盘事件的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了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感应鼠标图片透明度显示的方法 下一篇：jQuery实现感应鼠标动画效果自动伸长的输入框实

编程语言

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by