计算keyup上的剩余字符数

时间:2016-11-24 19:31:31

标签: javascript jquery

我想编写一个程序,在我输入文本框时计算剩余字符的长度,但代码不起作用。

以下是HTML代码:

<!DOCTYPE html>
<html lang="en">
    <head>
         <title>
         </title>
         <meta charset="utf-8" />
         <link rel="stylesheet" type="text/css" href="css/custom.css" />
    </head>
    <body>
        <textarea rows="10" cols="30" maxlength="100">
        </textarea>
        <p id="area_description"></p>
    <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
    <script type="text/javascript" src="js/custom.js" ></script>
    </body>
</html> 

以下是custom.js中的代码:

 $(document).ready(function(){
    $('#area_description').html('100 characters remaining.');
    $('textarea').on('keyup',function(){
        var x = $('textarea').val().length();
        var y = 100-x;
        $('#area_description').html(y+'characters remaining');
    });
 });

1 个答案:

答案 0 :(得分:1)

你有一个错字。将.length()替换为.length

$(document).ready(function(){
  $('#area_description').html('100 characters remaining.');
  $('textarea').on('keyup',function(){
    var x = $('textarea').val().length;
    var y = 100-x;
    $('#area_description').html(y+'characters remaining');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea rows="10" cols="30" maxlength="100">
</textarea>
<p id="area_description"></p>