文件中包含的 JS 函数未被调用？

Question

Javascript history.js 中包含的函数在 Struts 2 jsp 页面中未被调用，当我 select 下拉框中的一个项目时。

这是我在开发者工具中看到的错误

Uncaught ReferenceError: getClasses is not defined
    at HTMLSelectElement.onchange (history.action:279)

jsp 页面

中的收录方式

<%@ taglib uri="/WEB-INF/struts-tags.tld" prefix="s"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<script type="text/javascript" src="<s:url value='/js/common/ajax.js'/>"/>
<script type="text/javascript" src="<s:url value='/js/common/sorttable.js'/>"/>
<script type="text/javascript" src="<s:url value='/js/common/CalendarPopup.js'/>"/>
<script type="text/javascript" src="<s:url value='/js/common/skuformatting.js'/>"/>
<script type="text/javascript" src="<s:url value='/js/common/formatsku.js'/>"/>
<script type="text/javascript" src="<s:url value='/js/history.js'/>"/>
<script type="text/javascript">
    var cal = new CalendarPopup();      
</script>
...
...
<td align="center"> 
    <s:select id="form.search.deptFilter"  property="form.search.deptFilter" 
     list="form.deptSelectList" onchange="getClasses()" size="5"
     listKey="name" listValue="value" headerKey="-1" headerValue="Select a Department" />
</td>
...

getClasses() 在 history.js 中定义，这里是该文件中的方法定义。

...
    function getClasses(){
        var selectionComponent = document.getElementById('form.search.deptFilter');
        if(selectionComponent.options[selectionComponent.selectedIndex].value == -1)
            return;
        clearSubClasses();
        document.getElementById('form.search.classFilter').options.length = 0;  // Empty class select box
        sendAjaxRequest(selectionComponent,createClass);
    }
...

我在开发人员工具的源代码部分注意到一件事，我没有看到 js 文件夹中 jsp 页面中包含的所有 js 文件，我认为这是问题所在，但不确定原因。但几周前，一切正常。

知道为什么 history.js 文件中的 js 方法没有被调用吗？

Answer 1

问题是您的 JSP 页面生成了无效的 HTML。加载时它仍然调用它的元素的顺序。但是，<script> 标签在浏览器的单独线程中异步调用。

并且文档加载不会等待他们完成。因此，您尚未定义对该函数的引用，因为尚未加载该函数。为确保在文档中使用函数之前定义函数，您应该使用文档就绪事件。

通常的做法是，如果您使用 <head> 和 <body> 标签创建文档，并将 <script> 标签放在 <head> 中。 <head> 中定义的所有函数都可用于 <body> 元素。

文件中包含的 JS 函数未被调用？

JS function included in the file is not getting invoked?

javascript

html

struts2

struts