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

Posted 戈博小刀

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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="width: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;
});

 

以上是关于js中全局变量修改后的值不生效jsp页面中各个js中内容的加载顺序的主要内容,如果未能解决你的问题,请参考以下文章

jsp页面如何获js中if语句的变量值

js 循环之间的区别

JavaScript 如何修改其他js文件中的变量

jsp/js在修改页面把单选框的值传过去, 就是在修改页面要看到原先单选框选的是啥.

js在函数中传进全局变量,修改全局变量问题。

js定义变量获取指定id的value值,只能获取到整数,无法获取到小数点后的值