将计数器添加到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输入

回答

相关问题