如何在jsp文件中包含js文件并初始化一些函数

时间:2013-01-11 14:05:36

标签: javascript jsp spring-mvc

基本上我有javascript和jsp文件的2个问题。第一个涉及到我不能将externall js文件包含到jsp文件中的事实。我项目的基本结构如下所示:

system.web
       |
      WebContent
         |
         js
           |
            nowa_postac.js
         |
         jsp
           |
            nowa_postac.jsp

nowa_postac.js只有

 init = function() {
    test();
}
function test() {
        var myObject = JSON.parse('${gson}', null);
        alert(myObject.rasy.rasaList.length);
        alert(document.getElementById("testowy").id);
    }

我在nowa_postac.jsp中包含javascript:

<script type="text/javascript" src="${pageContext.request.contextPath}/js/nowa_postac.js"></script>

但是我无法在jsp文件和

中调用nowa_postac.js中的任何函数
 src="<c:url value="/js/nowa_postac.js"

似乎也没有工作...... test()只返回alert(test)返回文本,因此加载了javascript文件...此外,当test()在jsp文件中时,一切正常。

第二个问题是关于如何在加载jsp页面后初始化函数;

<body onload='init()'>

这里不好用,因为在init()中我需要引用在jsp中创建的一些对象... 谢谢你的帮助

1 个答案:

答案 0 :(得分:0)

我使用jQuery来回答这个问题。首先,我有一个名为includedScripts.txt的外部.txt文件,其格式如下:

NameOfFile~pathToJSFile

例如:

nowa_postac~nowaPostAc.js

请注意,nowaPostAc.js将驻留在名为 Scripts 的子文件夹中。

接下来我加载jQuery(我假设您知道如何执行此操作,如果没有,您可以阅读http://www.learningjquery.com/2006/09/introducing-document-ready#more-5)并且在我的jQuery文件中我有以下内容:

/*
    *
    * LOAD ADDITIONAL SCRIPTS
    */
    jQuery.ajax(
    {
        url: 'Scripts/includedScripts.txt'
        , timeout: 5000
        , success:
            function (data) {
                myArray = data.split(/\n/);
                for (var i = 0; i < myArray.length; i++) {
                    theContents = myArray[i].split("~");
                    goodToGo = false;
                    theFileName = "";

                    if (theContents.length == 1) {
                        goodToGo = true;
                        theFileName = theContents[0];
                    }
                    else {
                        for (var t = 0; t < theContents.length; t++) {
                            if (theContents[t].indexOf(".") != -1) {
                                theFileName = theContents[t];
                            }
                            else if (location.pathname.indexOf(theContents[t]) != -1) {
                                goodToGo = true;
                            }
                        }
                    }
                    if (goodToGo == true) {
                        pathToScript = (theFileName.indexOf("..") >= 0) ? theFileName.replace("..", "") : "Scripts/" + theFileName;
                        script = document.createElement('script');
                        script.type = 'text/javascript';
                        script.src = pathToScript;
                        if (jQuery("#ctl01").length > 0) {
                            jQuery("#ctl01").append(script);
                        }
                        else if (jQuery(".page").length > 0) {
                            jQuery(".page").append(script);
                        }
                    }
                }
            }
        , error:
            function (xhr, textStatus, errorThrown) {
                //alert("Could not load additional modules, please alert IT");
                //make a log entry...
            }
        , async: false
    }); // load additional scripts

您很可能需要编辑这些行:

if (jQuery("#ctl01").length > 0) {
                            jQuery("#ctl01").append(script);
                        }
                        else if (jQuery(".page").length > 0) {
                            jQuery(".page").append(script);
                        }

可能会读到类似的内容:

if (jQuery("body").length > 0) {
                            jQuery("body").append(script);
                        }
                        else if (jQuery("SomeOtherDivOrClass").length > 0) {
                            jQuery("SomeOtherDivOrClass").append(script);
                        }

脚本的功能(与includedScripts.txt文件一起使用)允许您根据页面指定要加载的其他脚本。当然,这假定您在所有页面上都加载了单个脚本,例如:

<script type="text/javascript"> src="Scripts/customeJQuery.js"></script>

将具有上述代码(加载附加脚本)。

这对我有用,你必须做一些调整 - 如果你通过,请告诉我。