logo标签列表

JQuery文本域字符计数

javascriptjqueryhtml
3

我正在尝试使用jQuery来计算文本区域中的字符数，以下是我目前的代码：

<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

 <script  type="text/javascript">
     $(document).ready(function() {
            $("#textfield").on('keyup, paste', function(){

            var Characters = ("#textfield").val().replace(/(<([^>]+)>)/ig,"").length;

            $("#counter").text("Characters left: " + (1500 - Characters));

        });
    });
</script>

</head>
<body>

 <form  id="input_form"  method="POST" action="?">
 <textarea  id="textfield"></textarea>
</form>

<div id="counter"></div>  

</body>
</html>

我的div中没有任何输出...有什么想法吗？

2个回答
2
您的代码存在两个问题：

1) 在传递事件列表/多个事件到on方法时，不需要使用逗号。应该是.on('keyup paste'

2) 获取文本区域的文本值时缺少jQuery选择器。您应该使用：

 $("#textfield").on('keyup, paste', function(){
        var Characters = $("#textfield").val().replace(/(<([^>]+)>)/ig,"").length;
        $("#counter").text("Characters left: " + (1500 - Characters));
 });

演示链接

1

存在两个问题：

  1. .on('keyup paste' 从这里删除逗号
  2. $("#textfield").val().replace 这里选择器中缺少$。

     $(document).ready(function() {
            $("#textfield").on('keyup paste', function(){ // <---remove ',' comma

            var Characters = $("#textfield").val().replace(/(<([^>]+)>)/ig,"").length; // '$' is missing from the selector

            $("#counter").text("Characters left: " + (1500 - Characters));

        });
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 <form  id="input_form"  method="POST" action="?">
 <textarea  id="textfield"></textarea>
</form>

<div id="counter"></div>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接