zoukankan      html  css  js  c++  java
  • 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;
    });
  • 相关阅读:
    Power BI for Office 365(八)共享查询
    Power BI for Office 365(七) Power BI站点
    Power BI for Office 365(六)Power Map简介
    Power BI for Office 365(五)Power View第二部分
    Power BI for Office 365(四)Power View第一部分
    Power BI for Office 365(三)Power Pivot
    Power BI for Office 365(二)Power Query
    java 继承、重载、重写与多态
    Android 热修复方案Tinker(一) Application改造
    阿里最新热修复Sophix与QQ超级补丁和Tinker的实现与总结
  • 原文地址:https://www.cnblogs.com/libin6505/p/10457988.html
Copyright © 2011-2022 走看看