Javascript 如何使用jQuery显示实时字符数？_Javascript_Jquery

Javascript 如何使用jQuery显示实时字符数？

javascript jquery

Javascript 如何使用jQuery显示实时字符数？,javascript,jquery,Javascript,Jquery,请检查我下面的代码。我想使用jquery javascript实时显示输入字符数。但问题是，当我用“textarea”进行操作时，它可以工作，但当我用普通的输入类型文本进行操作时，它就不工作了 <!DOCTYPE html> <html> <head> <title>Test</title> <script src="http://code.jquery.com/jquery-1.11.1.js" type="

请检查我下面的代码。我想使用jquery javascript实时显示输入字符数。但问题是，当我用“textarea”进行操作时，它可以工作，但当我用普通的输入类型文本进行操作时，它就不工作了

<!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>


试验
$（'text'）.keyup（updateCount）；
$（'text'）.keydown（updateCount）；
函数updateCount（）{
var cs=$（this）.val（）.length；
$（'字符'）.text（cs）；
}

对于“textarea”版本，您通过

$（'textarea'）选择“textarea”。键控（updateCount）

和

$（'textarea'）.keydown（updateCount）

很好，但使用文本输入时，选择输入文本是错误的

我通过在输入文本上放置一个名为“foo”的id来修复它。现在应该可以了


$（'foo'）.keyup（updateCount）；
$（'foo'）.keydown（updateCount）；
函数updateCount（）{
var cs=$（this）.val（）.length；
$（'字符'）.text（cs）；
}

如果您想获得文本类型的输入，必须使用如下选择器

$('input[type="text"]').keyup(updateCount);
$('input[type="text"]').keydown(updateCount);

以下是所有事件的列表这是一个将两个事件

keyup

和

keydown

组合成一行的工作小提琴
您的选择器错误，
文本不存在。因此，我调用input[name=“name”] 以通过您的name 值获取输入： $（'input[name=“name”]）。在（'keyup keydown'，updateCount'）；函数updateCount（）{ $（'#字符'）.text（$（this.val（）.length）； } 此处没有选择输入字段。尝试以下方法 $('input').keyup(updateCount); $('input').keydown(updateCount); 给你一个解决方案 $（'input[type=“text”]）.keyup（updateCount）；函数updateCount（）{ var cs=$（this）.val（）.length； $（'字符'）.text（cs）； } $（“输入”）.keyup（函数（）{ $（“#字符”）.text（$（this.val（）.length）； }); 代码中的所有内容都是正确的，您只需添加“：”即可。这将使它能够识别，它是输入类型例如： <script type='text/javascript'> $(':text').keyup(updateCount); $(':text').keydown(updateCount); function updateCount() { var cs = $(this).val().length; $('#characters').text(cs); } </script> $（'：text'）.keyup（updateCount）； $（'：text'）.keydown（updateCount）；函数updateCount（）{ var cs=$（this）.val（）.length； $（'字符'）.text（cs）； } 我只更改了你的脚本。只要找到更改，您就会得到它。 text 不是有效的选择器。