2015-08-03 54 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