通過JavaScript計算文本域輸入的剩餘字數

原始碼:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>通過JavaScript計算文本域輸入的剩餘字數</title>

<script type="text/javascript">

<!--

function size(par) {

var max = 80;

if (par.value.length < max)

var str = max - par.value.length;

document.getElementById("span").innerHTML = str.toString();

}

//-->

</script>

</head>

<body>

<textarea onkeyup="size(this);"></textarea>

<small>字數:80. 剩餘:<span id="span">80</span>.</small>

</body>

</html>

講解:

onkeyup是當用戶離開鍵盤後觸發的事件,傳遞的參數是this(也就是當前所在的文檔區域);

從參數中得到在textarea中已輸入的字符長度,並與前面指定的最大長度做比較;

var str = max - par.value.length;的作用是算出還可用多少個字符,將數值保存在str中; 最後通過getElementById定位到id為span的對象(在該HTML中為span),並將str里的值通過toString方法把數值變為字符串,反饋到span標籤內。

相關文章

  1. javascript:選取文本域中的內容

    javascript:選取文本域中的內容 工具/原料 Dreamweaver.exe 方法/步驟 新建html文件 創建輸入框和內容 創建按鈕 創建js函數 js函數獲取文本內容 預覽效果如圖 當點擊 ...
  2. javascript:設置和移開文本域上的焦點

    javascript:設置和移開文本域上的焦點 工具/原料 Dreamweaver.exe 方法/步驟 新建html文件 創建form表單 創建設置焦點的兩個按鈕 創建js函數 函數內容為獲取文本域焦 ...
  3. C# 創建PDF文本域並限制輸入字體、字號、顏色

    此條經驗將介紹如何通過C#編程在PDF中創建文本框,同時並設置用戶在文本框中輸入文本時,限制其輸入文本的字體.字號.字體顏色.文本換行等. 工具/原料 Free Spire.PDF for .NET ...
  4. 如何Excel2007畫斜線單元格中用文本框輸入文字

    在Excel表格中,我們經常會遇到在畫斜線的單元格輸入文字,大部分都是回車和ALT+Enter鍵完成對文字的輸入,但是還有沒有其他的方法呢?下面,小編就來教給大家在畫斜線的單元格中如何用文本框來輸入文 ...
  5. javascript 動態文本框效果

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head&g ...
  6. JavaScript寫文本基本語法

    在瀏覽器中通過查看原始碼的方式是無法看到 ASP 原始碼的,你只能看到由 ASP 文件輸出的結果,而那些只是純粹的 HTML 而已.這是因為,在結果被送回瀏覽器前,腳本已經在伺服器上執行了. 在我們的 ...
  7. 如何實現Java文本域拖動文字效果

    Java文本域,即Java中的多行文本框,很多軟體的輸入框內都可以對Text拖動處理,拖動以實現移動Text等操作.那麼Java中的JFrame對象中的JTextArea如何實現這種效果呢,讓我們拭目 ...
  8. excel中根據單元格文本內容輸入相應值

    excel中,我們可以根據某一單元格的文本內容,來決定輸入什麼樣的內容.比如如果第一列的單元格中包含有"佳"內容,則顯示YES,反則NO. 如果對你們有用,請投票收藏,謝謝! 工具 ...
  9. 在EXCEL中如何快速地計算文本格式公式的結果?

    在使用EXCEL的時候,偶爾我們也會遇見一些比較難處理的問題,比如我們需要將一些一連串的文本格式公式轉換成結果,如下圖.如果是少量的話,我們可以直接一個個加等號,這種土辦法就可以,但是如果是大量的話, ...
  10. Word教程-Word如何利用文本框輸入多重冪指數

    什麼是多重冪指數,實際上就是指數函數的形式,似於X^y這樣的,X稱之為底數,y成為指數,我們稱為X的y次冪.很多教程都是通過數學公式編輯器來輸入,對於沒有安裝數學公式編輯器插件的word來說,就有點麻 ...
  11. PPT文本框輸入怎麼設置下標

    日常生活中,使用辦公軟體OFFICE,有時候會遇到設置下標的問題.那麼,PPT文本框輸入怎麼設置下標呢?下面做一個簡單介紹. 方法/步驟 第一步,桌面下新建一個文檔 第二步,打開桌面下的這個文檔 第三 ...
  12. word如何利用域輸入分數

    打開word 插入--文檔部件--域 按CTRL+F9 輸入如圖所示  (其他分數自行更改)  輸好之後按F9 效果如圖
  13. ASP中文本域表單如何批量插入數據

    我們在製作asp表單的時候,可能會涉及到批量性的操作,如何利用文本域 批量插入數據到資料庫中呢?下面我為大家演示一下,ASP+ACCESS+IIS7+win764位本人親測成功! 方法/步驟 具體涉及 ...
  14. 如何在文本中輸入特殊符號

    在很多時候我們在寫東西的時候需要在文本中輸入特殊符號,很多時候我們都不知道怎麼來輸入特殊符號,那麼就讓我來給大家介紹一下用輸入法軟體輸入特殊符號. 工具/原料 百度輸入法 方法/步驟 首先在我們輸入文 ...
  15. 作曲大師音樂夢想家聲部文本的輸入

    作曲大師音樂夢想家軟體:簡譜,五線譜,吉他譜.四線譜(支持尤克里里和貝司).簡譜鼓譜.五線譜鼓譜.琵琶譜.民樂戲曲譜的混合排版.自動配器以及MIDI音樂製作並能加載VSTI音源生成MP3,專業級簡譜與 ...
  16. 如何在Excel中用EVALUATE計算文本算式的值?

    如下圖所示,A列為一列文本形式的算術表達式,要想在B列求出這些算術表達式的值可以藉助定義名稱結合宏表函數EVALUATE. 工具/原料 Excel 方法/步驟 按下Ctrl+F3組合快捷鍵,將彈出&q ...
  17. EXCEL中計算文本長度的函數:LEN

    EXCEL中計算文本長度的函數是:LEN函數 下面我們講講LEN函數的用法: LEN(需要計算文本長度的區域) 例如:
  18. 快速在文本中輸入數學中的運算符號

    快速在文檔裡面輸入 ×÷≠><≯≮≥≤ 工具/原料 搜狗輸入法 方法/步驟 打開搜狗輸入法 乘以號×:輸入cheng,選擇第五個選項 除號÷:輸入chu,選擇第五個選項 不等號≠:輸入bu ...
  19. 怎樣在Word2003中使用EQ域輸入數學公式

    在Word2003文檔中輸入數學公式時,用戶一般都選擇使用"公式編輯器"來輸入公式.除了公式編輯器以外,用戶還可以在Word2003中通過編輯EQ域來編輯數學公式. 步驟/方法 1 ...
  20. PPT文本框輸入怎麼設置上標

    日常生活中,使用辦公軟體OFFICE,有時候會遇到設置上標的問題.那麼,PPT文本框輸入怎麼設置上標呢?下面做一個簡單介紹. 方法/步驟 第一步,桌面上新建一個文檔 第二步,打開桌面上的這個文檔 第三 ...