JavaScript函数无法在外部文件中运行

Question

我在外部文件中有两个函数，然后在HEAD脚本中调用A和B，并且A可以运行而B不能运行，但是如果将B放入头脚本中，则B也可以运行。 我不确定为什么，该怎么办？

HTML：

<head>
<script language="JavaScript" type="text/JavaScript">
<!--
function B(id) {
    var selected = document.getElementById(id)
    var arr = selected.options[selected.selectedIndex].text.split(" ");
    var value = ""
    for (var i = 1; i < arr.length; i++) {
        if (value != "") value = value + " ";
        value = value + arr[i];
    }
    return value;
}

function save() {
    A("msg");
    var x = B(id);
}
-->
...
<script type="text/JavaScript" src="js/my.js"></script>
</body>
...

my.js：

function A(msg) {
    scroll(0,0);
    var outerPane = document.getElementById('FreezePane');
    var innerPane = document.getElementById('InnerFreezePane');
    if (outerPane) outerPane.className = 'FreezePaneOn';
    if (innerPane) innerPane.innerHTML = msg;
}

function B(id) {
    var selected = document.getElementById(id)
    var arr = selected.options[selected.selectedIndex].text.split(" ");
    var value = ""
    for (var i = 1; i < arr.length; i++) {
        if (value != "") value = value + " ";
        value = value + arr[i];
    }
    return value;
}

Answer 1

最安全的做法是将代码包装在window.onload处理程序的头部，像这样...

<head>
  <script type="text/javascript">
    window.onload = function(){
      // your external files are guaranteed to be loaded now
      // you can call A or B
    }
  </script>
</head>

仅在加载所有外部脚本之后才触发onload 。

这是一个完整的例子...

index.html

<!DOCTYPE html>
<html>
<head>
<title>Hello world</title>
<script>
function save() {
  A()
  B()
}

window.onload = function() {
  save()
}
</script>
</head>

<body>
The content of the document......
<script src="./external.js"></script>
</body>

</html>

external.js

function A() {
  alert('A ran')
}

function B() {
  alert('B ran')
}

注意：这比将外部脚本移到头部更好，就像其他答案所建议的那样，因为在头部中加载的外部资源会阻塞整个页面的呈现，直到它们被加载为止。

通过将外部脚本保留在body标签的末尾，页面加载将变得更快，因为css / html将立即显示。 即使尚未加载JavaScript。

Answer 2

在script标记包含“保存”功能之前添加外部文件。

<script language="JavaScript" src = "yourfile.js" type="text/JavaScript">
</script>
<script language="JavaScript" type="text/JavaScript">
   function save(){
           A();
           B();
   }
</script>

JavaScript函数无法在外部文件中运行

问题描述

2 个解决方案

解决方案1
2 已采纳 2017-06-09 02:12:20

解决方案2
0 2017-06-09 02:11:25

JavaScript函数无法在外部文件中运行

问题描述

2 个解决方案

解决方案1 2 已采纳 2017-06-09 02:12:20

解决方案2 0 2017-06-09 02:11:25

解决方案1
2 已采纳 2017-06-09 02:12:20

解决方案2
0 2017-06-09 02:11:25