如何使用jQuery显示实时字符数? [英] How to display real time characters count using jQuery?
本文介绍了如何使用jQuery显示实时字符数?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
请在下面检查我的代码.我想使用jquery javascript实时显示输入字符数.但是问题是，当我使用"textarea"执行此操作时，它会起作用，但是当我使用普通输入类型的文本执行相同操作时，它将不起作用.
Please check my code below. I want to display input characters number real time using jquery javascript. But problem is when i am doing it with "textarea" it works but when i do same with normal input type text its not work.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery-1.11.1.js" type="text/javascript"></script>
</head>
<body>
<!-- Works -->
<!-- <textarea></textarea>
<span id="characters"><span>
<script type='text/javascript'>
$('textarea').keyup(updateCount);
$('textarea').keydown(updateCount);
function updateCount() {
var cs = $(this).val().length;
$('#characters').text(cs);
}
</script> -->
<!-- Not works -->
<input type="text" name="name">
<span id="characters"><span>
<script type='text/javascript'>
$('text').keyup(updateCount);
$('text').keydown(updateCount);
function updateCount() {
var cs = $(this).val().length;
$('#characters').text(cs);
}
</script>
</body>
</html>
推荐答案
在这里，您可以将两个事件keyup和keydown合并为一行:-)
Here is a working fiddle with combining your two events keyup and keydown into one line :-)
您的选择器错误，text不存在.因此，我呼叫input[name="name"]来通过您的name值获取输入:
Your selector was wrong, text doesn't exist. So I call input[name="name"] instead to get the input by your name value:
$('input[name="name"]').on('keyup keydown', updateCount);
function updateCount() {
$('#characters').text($(this).val().length);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="name">
<span id="characters"><span>
这篇关于如何使用jQuery显示实时字符数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
