JavaScript执行从函数声明开始,而不是从$(document).ready()开始

JavaScript execution beginning at function declarations rather than $(document).ready()?

本文关键字:开始 ready document 函数 执行 声明 JavaScript      更新时间:2023-09-26

我正在尝试为动态下拉菜单编写一个脚本,以此来学习OOP javascript和jQuery。你可以在www.industrialMerchants.com/industryMerchants/javascript/horizontalDropMenu2.js 上看到这个虚拟站点

该脚本首先定义了许多对象,然后我有了一个$(document).ready(),它带有一个闭包,用于启动将相关jQuery对象和DOM元素包装到我的对象模型中的过程。

问题是,当我加载作为虚拟网站的静态html文档时,Firebug会给我以下错误:

"TypeError: jqObject is undefined."

错误指向以下函数的第五行。

function Menu(jqObject) {
    self = this;
    this.self = jqObject;
    this.submenus = (function(){
        jqObject.children().children("ul").each(function() { <<--- Error
            submenu = new Submenu($(this), self);
            submenus.push(submenu);
            return submenus;
        });
    }());
}

调用函数的行在这里:

$(document).ready(function(){ 
     menus = new Array();
     $("ul.horizontalDropMenu").each(function(){
         menu = new Menu($(this));
         menus.push(menu);
     });
 });

正如您所看到的,对Menu()对象构造函数的调用包括对jQuery对象的引用作为参数,因此jqObject是明确定义的。那是什么呢?

当我从$(document).ready()声明开始在代码中插入断点时,执行会完全跳过它,并从函数声明本身开始。就好像浏览器试图在对函数声明进行任何显式调用之前执行它们一样。

设置断点并向上调用堆栈会显示以下行(在.ready之外,但这无关紧要):

Submenu.prototype = new Menu();

您创建的菜单实例没有jQuery对象,而是使用undefined