Question

我有一个最多125个字符的JavaScript计数器。一旦达到125，计数器显示“125”。我怎么能说“Max Characters”呢？

<script language="JavaScript">
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit) 
field.value = field.value.substring(0, maxlimit);
// otherwise, update 'characters left' counter
else 
countfield.value = field.value.length;
}
</script>

<center>
<form name=myform action="#">
<font size="1" face="arial, helvetica, sans-serif"> 
( You may enter up to 125 characters. )<br>
<textarea name=message wrap=physical cols=28 rows=4 
 onKeyDown="textCounter(this.form.message,this.form.remLen,125);" 
 onKeyUp="textCounter(this.form.message,this.form.remLen,125);"
    ></textarea>
<br>
<input readonly type=text name=remLen size=3 maxlength=3 value="0"> characters total</font>
</form>
</center>

Answer 1

function textCounter (field, countfield, maxlimit) {
    if (field.value.length > maxlimit) {
        field.value = field.value.substring(0, maxlimit);
        countfield.value = 'max characters';
    } else { // otherwise, update 'characters left' counter
        countfield.value = field.value.length;
    }
}

Answer 2

为什么不做这样的事情： http://jsfiddle.net/9AeT4/

它可以让用户知道他们输入的内容有多少。看看它在行动中的小提琴。也不需要jQuery。基本的JavaScript。

<textarea id="remLen" name="remLen" onkeyup="textCounter('remLen','remLen_count',125);">Some initial text</textarea>
<div id="remLen_count"></div>

textCounter=function(textarea, countdown, maxlimit)
{
  textareaid = document.getElementById(textarea);
  if (textareaid.value.length > maxlimit)
    textareaid.value = textareaid.value.substring(0, maxlimit);
  else
    document.getElementById(countdown).innerHTML = ''+(maxlimit-textareaid.value.length)+' characters left';
}

/*to correctly set the chars left initially if there is initial text in the field*/
textCounter('remLen','remLen_count',125);

Answer 3

这是一个JSFiddle。我使用jQuery是因为，为什么不呢？

HTML看起来像这样：

<form name="myform">
    <textarea id="myMessage"></textarea>
</form>
<font id="characterCounter"></font>

脚本将是：

$("#myMessage").keyup(function(){
    var length = $(this).val().length;
    if (length != 125 && length < 125)
        $("#characterCounter").html(length + " of 125 characters. " + (125 - length) + " left!");
    else if (length > 125)
        $("#characterCounter").html((length - 125) + " extra characters!");
    else
        $("#characterCounter").html("Max characters!");
}).keyup();

基本上，每次按某个键时，它都会使用字符数量更新<font>标记。

Answer 4

尝试将js函数 textCounter 更改为此项，如果看看是否可以按预期工作

function textCounter(field, countfield, maxlimit) {

    field.value = field.value.substring(0, maxlimit);
    (field.value.length==125)?countfield.value="Max. Characters.":countfield.value=field.value.length;
}

它有效，我不知道是否覆盖你的问题。

如何在JavaScript计数器中添加“Max Characters”文本？

4 个答案: