Question

我有以下脚本用于此目的，但想添加一个计数器，以便在视觉上告知用户剩余的字符。

脚本

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>

Answer 1

你可以在limit函数中添加几行来获取一些元素，并根据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;
}

Answer 2

朋友;

您可以在onKeyDown上使用此功能

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

PS：keycode 8退格。

Answer 3

脚本

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

Answer 4

这是jQuery plugin就是这样做的。

添加计数器到textarea输入

4 个答案: