问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

为什么会console.log();是空

头像
落山基胡扔队
    5052724
    <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <form action="">
            <input type="text" id="mobile" placeholder="请输入手机号码" />
        </form>
    </body>
    <script type="text/javascript">
    window.onload = function(){
        var mobile = document.getElementById("mobile");
        var mobileV = document.getElementById("mobile").value;
        mobile.onchange = function(){
            console.log(mobileV);
        }    
    }
    </script>
</html>
    javascripthtml
    阅读 5.4k
    6 个回答
    得票最新
    头像
    agui1989
      4.6k16153196
      ✓ 已被采纳

      把var mobileV = document.getElementById("mobile").value;放到onchange函数里面去就可以了。

      你这样写的话，mobileV取到的值是最开始的值，也就是你的onchange事件发生之前的值。
      当然是空的了。

      如果你一开始给个值的话，它就会只取到最开始的这个值。

      头像
      simaguo
        12841925
            mobile.onchange = function(){
        var mobileV = document.getElementById("mobile").value;
        console.log(mobileV);
    }
        头像
        张小猪粉鼻子
          2.9k2512

          你的mobileV在onload就确定了，而不是每次change的时候。

          头像
          她说她喜欢浪丶
            4.9k66384414

            JavaScript 运行在执行状态 而不是定义状态

            头像
            leftstick
              27.3k33329

              换成这样呢：

              <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <form action="">
            <input type="text" id="mobile" placeholder="请输入手机号码" />
        </form>
    </body>
    <script type="text/javascript">
    window.onload = function(){
        var mobile = document.getElementById("mobile");
        mobile.onchange = function(){
            var mobileV = document.getElementById("mobile").value;
            console.log(mobileV);
        }    
    }
    </script>
</html>

              尝试理解这里面的差异，自然就明白为什么了

              头像
              六个核桃
                -11
                新手上路，请多包涵

                因为mobileV一开始就获取到了，在函数每次执行的时候，这个函数并没有重新获取mobileV的值。所以自然就是空喽。

                撰写回答
                你尚未登录，登录后可以
                • 和开发者交流问题的细节
                • 关注并接收问题和回答的更新提醒
                • 参与内容的编辑和改进，让解决方法与时俱进
                推荐问题