2015-08-03 82 views
2

我试图使用jQuery在文本区域计数字符,这里是我迄今为止..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 ...任何想法为什么?

+0

仍然一无所获:( – Brian

回答

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>

2

你在你的代码

1),同时通过事件列表/多个事件的方法,你不需要逗号的两个问题。它应该是.on('keyup paste'

2)您在获取textarea的文本值时缺少jquery选择器。你应该使用

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

Working Demo