Question

当我们在同一个html文件中时，如何从另一个脚本中调用webService（）。

从第二个脚本调用方法的第一个脚本

<script type="text/javascript">
    function validate(){
       //validate body
       //how to call webService() here;
    }
</script>

第二个脚本

<script type="text/javascript">
    function webService(){ 
       //WEB SERVICE FUNCTION BODY
    }
</script>

html：

<input type="button" value="Login" id="loginButton" onclick="validate();">

Answer 1

你可以做的是使用全局包装器arround函数

<html>
  <head>
    <script type="text/javascript">
      function validate(){
        alert("calling Script1")
        if(WRAPPER) WRAPPER.webService()
      }
    </script>
  </head>
  <body>
    <script type="text/javascript">
      var WRAPPER = {}
      WRAPPER.webService = function(){ 
        alert("Script1")
      }
    </script>
    <input type="button" value="Login" id="loginButton" onclick="validate();">
  </body>
              
</html>

虽然如果直接从头部调用函数，但是主体上的脚本不会被加载。您可能需要将validate（）包装在

周围

document.addEventListener('DOMContentLoaded', function() {
     validate()
  }, false);`

Answer 2

与通常调用javascript函数的方式相同。 Benjamin Gruenbaum声明你应该在验证函数之前声明函数webService。

<script type="text/javascript">
    function webService(){ 
       //WEB SERVICE FUNCTION BODY
    }
</script>

<script type="text/javascript">
    function validate(){
       //validate body
       webService();
    }
</script>

Answer 3

通常，您会将代码放在两个不同的js文件中，并在验证之前包含webService，这将使一个函数在另一个之前可用。

<body>
    // other code
    <script src="scriptWithWebService.js"></script>
    <script src="scriptWithValidate.js"></script>
</body>

Answer 4

这与scope有关。所有Javascript元素都按顺序解析。首先是头部中的那些，然后是身体中的那些。函数首先被解析，并且在定义时不被执行。之后执行声明和函数调用。例如：

<script>
    runCode();
    function runCode()
    {
        alert(1);
    }
</script>

可行，因为在解析时首先定义函数runCode，但是此示例将失败：

<script>
    runCode();
</script>

<script>
    function runCode()
    {
        alert(1);
    }
</script>

这将失败，runCode在定义之前被调用，因为第二个脚本块尚未被解析。以下示例将起作用：

<script>
    function runCode()
    {
       runUpdate()
    }
</script>

<script>
     function runUpdate()
     {
        alert(1);
     }
     runCode();
</script>

即使在解析runUpdate时未定义runCode，也不会引发未定义的错误，因为函数的内容在被调用之前不会被执行。

因此，在文档加载结束时，所有Javascript都被解析为全局范围。（或简化：它被放在一大堆）。

因此，当加载文档时，代码如下所示：

    function validate(){
       //validate body
       //how to call webService() here;
    }

    function webService(){ 
       //WEB SERVICE FUNCTION BODY
    }

并且您点击事件的输入可以调用validate()而validate可以调用webservice，因为两者都已定义。

如何从另一个JavaScript调用javascript函数？

4 个答案: