將計數器添加到textarea輸入

我有以下腳本來達到目的，但想要添加一個計數器以通過視覺通知用戶其餘字符。將計數器添加到textarea輸入

腳本

function limit(element, max_chars) 
{ 
    if(element.value.length > max_chars) 
     element.value = element.value.substr(0, max_chars); 
}

HTML

<textarea onkeyup="javascript:limit(this, 150)" onblur="limit(this,150)" name="message" rows="4" style="width:99%; margin: 0;" class="unfocusinput"></textarea>

來源

2011-04-25 Frank Nwoko

您可以添加幾行到您的極限函數，該函數獲取一些元素並根據element.value.length的值更新其內容。

HTML：

<textarea ...></textarea> 
<span id="contentLen">count goes here</span>

的javascript：

function limit(element, max_chars) 
{ 
    if(element.value.length > max_chars) 
    { 
     element.value = element.value.substr(0, max_chars); 
    } 
    document.getElementById ('contentLen').innerHTML = element.value.length; 
}

來源

2011-04-25 15:26:23 GordonM

它計算鍵入的字符數，而不是剩餘的字符數。我該怎麼做呢？ – 2011-04-25 15:40:26

那麼在這種情況下，你只需要從max_chars中減去element.value.length。 – GordonM 2011-04-25 15:42:10

-1

這裏有一個jQuery plugin是做到了這一點。

來源

2011-04-25 15:23:51

感謝。將檢查出來。順便說一句，這些日子裏裝載的插件數量正在逐漸失控。 – 2011-04-25 15:28:21

...沒有。編寫你自己的代碼或者複製和粘貼就失控了。使用庫一直是解決問題的更好方法。 – 2011-04-25 15:29:29

提供鏈接不是解決方案，使用插件並不總是更好的方法。 – Hussein 2011-04-26 19:12:19

朋友;

您可以使用的onkeydown

此功能

if(document.getElementById(element).value.length==limit && event.keyCode!=8) 
document.getElementById(element).blur();

PS：鍵碼8退格。

來源

2011-04-25 15:27:59 esquare

刪除或返回如何？ :) – 2011-04-25 15:41:48

腳本

function limit(element, max_chars, counter) 
{ 
    if(element.value.length > max_chars) 
     element.value = element.value.substr(0, max_chars); 
    document.getElementById(counter).innerHTML = element.value.length - max_chars; 
}

HTML

<textarea onkeyup="javascript:limit(this,150,'someCounter')" onblur="limit(this,150,'someCounter')" name="message" rows="4" style="width:99%; margin: 0;" class="unfocusinput"></textarea> 
<span id"someCounter">150</span> chars left

來源

2011-04-25 15:29:05

將計數器添加到textarea輸入

回答

相關問題