0

我一直在尝试实现一个字符计数器，它显示用户可以使用 jQuery 在文本区域内输入的字符数。这是代码：

HTML：

<textarea id="questionTextBox"  placeholder="Enter question e.g. How do I as for a pay raise?" name="data[Qna_question][question_text]"></textarea>

<span id="noOfChar">128</span> characters remaining

查询：

jQuery(document).ready(function(){

 jQuery("#questionTextBox").keypress(function () {

   var qText = jQuery("#questionTextBox").val();

   if(qText.length <= 127) {
    jQuery("#noOfChar").html(128 - qText.length - 1);
   } else {
       jQuery("#questionTextBox").val(qText.substring(0,128));
   }

  });

});

这是 jsfiddle http://jsfiddle.net/Cy667/

它无法正常工作。

  1. 当它达到 128 个字符时，它不应再取值
  2. 当我删除字符时，计数器应该增加。当我在达到 128 个限制后删除前几个字符时，它并没有增加。
4

2 回答 2

1

您需要使用所有三个 jQuery 键事件来捕捉用户使用他的键盘所做的一切。

这应该可以解决您的问题：JSFiddle

$(document).ready(function(){

    function updateCount ()
    {
        var qText = jQuery("#questionTextBox").val();

       if(qText.length < 128) {
           jQuery("#noOfChar").html(128 - qText.length);
       } else {
           jQuery("#noOfChar").html(0);
           jQuery("#questionTextBox").val(qText.substring(0,128));
       }
    }

    $("#questionTextBox").keyup(function () {
        updateCount();
    });
    $("#questionTextBox").keypress(function () {
        updateCount();
    });
    $("#questionTextBox").keydown(function () {
        updateCount();
    });
});
于 2013-08-08T09:20:55.280 回答
0

对于第一个问题，您可以只使用 textarea 的 maxlength 属性

<textarea maxlength="128"></text>

对于第二个问题，我尝试通过按功能键（例如退格键、shift 等）使其不起作用，因此您可以将函数绑定到 textarea 的onchange侦听器。

于 2013-08-08T09:41:50.470 回答