DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> javascript文本框內輸入文字倒計數的方法
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程序設計有所幫助。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved