有个疑惑

首页课程实战体系课手记专栏慕课教程

有个疑惑

来源：2-25 项目作业

Javed

2021-03-28 12:28:59

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form action="">
        <input type="text" id="username">
    </form>
    <script>
        var user = document.getElementById('username');
        user.onkeypress = function() {
            console.log(user.value);
            console.log(user.value.length);
        }
    </script>
</body>

</html>

问题描述：

为什么我在文本框输入一个字符，但是控制台却输出空，而不是输出我输入的字符。并且长度也不对。

相关截图：

写回答

1回答

好帮手慕慕子

好帮手慕慕子

2021-03-28

已采纳

同学你好，因为在输入框中输入内容，按下键盘并松开，触发onkeypress事件时，此时还没来得及将值写入input，所以一开始获取到的输入框的值为空，即：一开始在文本框输入一个字符，控制台却输出空，由于每次获取到的都是上一次输入框中的值，所以最终输入了4个w，而控制台中显示的是上一次输入的3个w。

建议修改：

使用onkeypress事件获取输入框输入的值存在误差，推荐使用onblur事件，在输入框失去焦点的时候对输入的值进行判断。示例：

祝学习愉快~

1

haved

hp>谢谢老师的解答喔！

h021-03-28

共1条回复

0 学习 · 15276 问题

相似问题

老师遇到个问题有点疑惑

回答 1

实现时的一些小疑惑

回答 1

老师，咱们这个体系课有交流群吗

回答 1

回答 2

我完成修改了，还有2个细节问题。

回答 1

打开慕课网App查看更多内容