Javascript函数无法从外部文件访问

javascript function not accessible from external file

本文关键字：文件 访问 从外部 函数 Javascript      更新时间：2023-09-26

这可能是一个愚蠢的初学者的问题，但它让我发疯。简化后的代码是:

  1. 我有一个index.php，其中在一个内联脚本(位于头部元素)，一些JS函数被定义。

    <script type="text/javascript">
  $(function(){ 
    // other code
    var popup = function(message,color){
      $(".title").css({"color": "beige" });
      $(".popup_alert").css({"background-color": color});
      $( ".popup_alert" ).append(message);

      $(".popup_alert").removeClass("offscreen").delay(800).queue(function(){
        $(this).addClass("offscreen").dequeue();
        $(this).empty();
        $(".title").css({"color": "#444" });    
      });
    };
  };
</script>

  2. 在<body>的底部，我正在加载一个外部JS文件，其中一些JQuery发生:

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

    JQuery不是问题。

  3. 在这个链接的文件中，我不能调用index.php中定义的函数。

    popup("test",orange);

    将产生控制台错误"Uncaught ReferenceError: popup is not defined"

这正常吗?我已经把ajaxtodb。js中的所有东西都包装在a中了$(function(){…});我读到这将迫使页面首先加载，但无济于事…

我忽略的那个愚蠢的细节是什么?

感谢@guest271314，我学到了JS结构的一课:

之前，我在$(function(){};的主文档的脚本标签中包装了整个代码，我认为这是"必要的"，因为脚本标签被放置在head元素中，否则文档就不会准备好了。

然而，当使用另一个外部JS文件时，这种技术现在阻止外部代码引用内联声明的函数，因为这些代码现在"等待"文档的其余部分准备好，包括外部文件(然后引用尚未声明/"挂起"的主函数)。

哇。

移除$(function(){};包装并将脚本元素移动到body的底部解决了这个问题。我想它一开始就应该在那里……升级

相关文章：