javascript文本框內(nèi)輸入文字倒計(jì)數(shù)的方法
更新時(shí)間：2015年02月24日 11:13:37 作者：代碼家園
這篇文章主要介紹了javascript文本框內(nèi)輸入文字倒計(jì)數(shù)的方法,涉及javascript針對(duì)鍵盤事件的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了javascript文本框內(nèi)輸入文字倒計(jì)數(shù)的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
復(fù)制代碼 代碼如下:
<html>
<head>
<title>文本框內(nèi)輸入文字倒計(jì)數(shù)效果</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
maxLen = 100; //定義用戶可以輸入的最多字?jǐn)?shù)
function checkMaxInput(obj) {
if (obj.value.length > maxLen){ //如果輸入的字?jǐn)?shù)超過了限制
obj.value = obj.value.substring(0, maxLen); //就去掉多余的字
remLen.innerText = '您輸入的內(nèi)容超出了字?jǐn)?shù)限制'
}
else{
remLen.innerText = '還剩下' + (maxLen - obj.value.length) + '字';//計(jì)算并顯示剩余字?jǐn)?shù)
}
}
// 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>倒計(jì)數(shù)文本框</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>
<head>
<title>文本框內(nèi)輸入文字倒計(jì)數(shù)效果</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
maxLen = 100; //定義用戶可以輸入的最多字?jǐn)?shù)
function checkMaxInput(obj) {
if (obj.value.length > maxLen){ //如果輸入的字?jǐn)?shù)超過了限制
obj.value = obj.value.substring(0, maxLen); //就去掉多余的字
remLen.innerText = '您輸入的內(nèi)容超出了字?jǐn)?shù)限制'
}
else{
remLen.innerText = '還剩下' + (maxLen - obj.value.length) + '字';//計(jì)算并顯示剩余字?jǐn)?shù)
}
}
// 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>倒計(jì)數(shù)文本框</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>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
js實(shí)現(xiàn)二級(jí)聯(lián)動(dòng)簡(jiǎn)單實(shí)例
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)二級(jí)聯(lián)動(dòng)簡(jiǎn)單實(shí)例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-01-01
文檔對(duì)象模型DOM（Document Object Module）定義了用戶操作文檔對(duì)象的接口，它使得用戶對(duì)HTML有了空前的訪問能力，并使開發(fā)者能將HTML作為XML文檔來處理。2009-12-12
JS實(shí)現(xiàn)iframe中子父頁面跨域通訊的方法分析
這篇文章主要介紹了JS實(shí)現(xiàn)iframe中子父頁面跨域通訊的方法,結(jié)合實(shí)例形式分析了JS實(shí)現(xiàn)iframe頁面跨域通訊常見操作技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下2020-03-03
javascript中break，continue和return語句用法小結(jié)
break，continue和return這三個(gè)語句的用法新手們經(jīng)常弄混淆，至少在我學(xué)習(xí)c語言的時(shí)候經(jīng)常把它們的用法給搞錯(cuò)。不過現(xiàn)在好了，我已徹底搞清楚它們之間的用法2012-05-05
javascript 數(shù)組排序函數(shù)sort和reverse使用介紹
reverse方法將一個(gè)Array對(duì)象中的元素位置進(jìn)行反轉(zhuǎn)，sort方法返回一個(gè)元素已經(jīng)進(jìn)行了排序的 Array 對(duì)象，下面為大家介紹下2013-11-11
第一次接觸神奇的Bootstrap，Bootstrap提供了用戶友好、擴(kuò)瀏覽器的解決方案,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-10-10
JS數(shù)組去重常用方法實(shí)例小結(jié)【4種方法】
這篇文章主要介紹了JS數(shù)組去重常用方法,結(jié)合實(shí)例形式總結(jié)分析了4種常用的數(shù)據(jù)去重實(shí)現(xiàn)方法,涉及javascript數(shù)組的遍歷、判斷、追加等相關(guān)操作技巧,需要的朋友可以參考下2018-05-05
如果需要在程序中獲取當(dāng)前用戶的IP,通常手段都是需要使用服務(wù)器,但現(xiàn)在借助WebRTC的強(qiáng)大功能,我們可以直接在瀏覽器客戶端獲取用戶IP,所以本文小編將給大家介紹一下如何在在瀏覽器中使用WebRTC獲取用戶IP地址,文中通過代碼示例講解的非常詳細(xì),需要的朋友可以參考下2023-11-11
在javascript中，null＞=0 為真，null==0卻為假，null的值詳解
這篇文章主要介紹了在javascript中，null＞=0 為真，null==0卻為假，null的值詳解的相關(guān)資料,需要的朋友可以參考下2017-02-02
這篇文章主要介紹了JavaScript?引用類型之原始值包裝類型String,String是對(duì)應(yīng)字符串的引用類型。要?jiǎng)?chuàng)建一個(gè)String?對(duì)象，使用String?構(gòu)造函數(shù)并傳入一個(gè)數(shù)值,更多相關(guān)內(nèi)容需要的朋友可以參考一下2022-07-07