• js中全局变量修改后的值不生效【jsp页面中各个js中内容的加载顺序】


    一个老项目中,一个jsp文件中有很多个js文件,

    现在要在页面上的一个地方判断一个状态,因为一直找不到原来是在哪里修改的那个状态,所以决定不找了,而是在比较靠前引入的一个js中定义一个全局变量,然后在这个js的 $(function(){}} 方法中通过一个ajax向后台获取正确的状态,然后在所有的js都加载完之后根据全局变量的值的状态来修改页面上的逻辑。

    但是发现,全局变量被一个外部js修改赋值后,我在jsp页面的最下面居然取不到修改过的值。

    请教同事才发现原来原因是 

    任何一个js文件中的 $(function(){});方法中的代码需要整个页面(包括页面上所有的内外js文件)都加载完成才会执行。

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
        </head>
        <body>
            哈哈哈
            <div id="chartmain" style="600px; height: 400px;"></div>
        </body>
        <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
        <script type="text/javascript" src="js/echarts.js"></script>
        <!-- 引入外部js文件 -->
        <script type="text/javascript" src="js/1.js"></script>
        <script>
            //打印全局变量
            alert(HAHA);  //结果是 1,不是 2
            /**
             * 原因是在页面中的script中的代码是顺序加载的,但是只是加载普通的变量,和方法定义,
             * 并不会执行任何一个js中(包括页面内部script标签中的)初始化方法 $(function(){...});中的代码逻辑。
             * 所以上面打印的时候打印的还是全局变量定义时的值
             */
            
            //要想获取 在外部js 1.js 的初始化方法(可能是一个同步ajax)中重新给全局变量赋的值,可以用如下方法
            $(function(){
                //在js的初始化方法中修改全局变量的值为2
                alert("修改后的值: "+HAHA);  //结果2
            });
            
        </script>
    </html>

    1.js代码

    //定义一个全局变量,赋值为1;
    HAHA=1;
    
    $(function(){
        //在js的初始化方法中修改全局变量的值为2
        HAHA = 2;
    });
  • 相关阅读:
    nginx启动失败
    Windows下载安装docker详细步骤
    Consul
    Idea导入多个maven项目到同一目录下
    使用V-chart时踩过的一些坑
    java集合超详解
    HashMap
    curl和wget的区别和使用
    SourceTree3.2.6版本跳过注册办法
    单点登录
  • 原文地址:https://www.cnblogs.com/libin6505/p/10457988.html
Copyright © 2020-2023  润新知