Question

设置：

我编写了一些JavaScript来动态填充包含数据的表格，然后在任何数据上侦听点击事件，然后动态填充并显示包含所点击数据信息的模态对话框。请参阅我网站的/test-table页面和CodePen上的笔Table Play。到目前为止，一切都是杰克，只是笨拙。

现在我需要将所有JS放在页面的<head>中。但是JS操纵DOM，所以我必须延迟执行直到页面加载。我已经找到了解决这个问题的答案，它将JS包装在jQuery语句中：

$(document).ready(function() {
  // ... js code here ...
});

或

$(window).bind('load', function() {
  // ... js code here ...
});

问题：

但是，这会导致JS抛出运行时错误。

在我的系统上本地测试时，错误是＆＃34; Uncaught ReferenceError：未定义类。＆＃34;在笔Table Play中对其进行测试时，未定义了未捕获的ReferenceError：removePopup。＆＃34; Classes是JS填充表的对象数组。 RemovePopup是单击模态对话框关闭按钮时调用的函数。

编辑0：

TablePlay基本代码没有jQ。当我把代码

$(document).ready(function() {

在JS第1行和代码

});

在JS第316行（最后一行），然后点击表格单元格项目，然后点击模态对话框的关闭按钮，＆＃34; removePopup未定义＆＃34;错误记录到控制台。见screenshot。

removePopup函数被设置为JS第190行的dismiss按钮的onclick函数。它从JS第92行开始定义。对于发生错误的行，控制台消息只是说＆＃ 34; onclick @ index.html？editors = 0010：格式化：1＆＃34;。

结束编辑0

只有在将JS包装到任一jQ语句中时才会出现错误。笔中的JS和我系统本地的JS是相同的，前者从后者复制并粘贴，因此可以预期任何错误都是相同的。

问题：

有没有人知道可能会发生什么？

为什么在其中一个jQ语句中包装否则正确的JS会导致＆＃34; undefined＆＃34;错误，为什么它是我的系统上的变量类和笔中的函数removePopup？

更重要的是，当然，在DOM完全加载之前，如何延迟JS的执行？

Answer 1

好吧，我还没确定导致函数未定义错误的是什么，但我发现了一个有效的替代实现。

我没有使用jQuery文档就绪处理程序，而是添加了

window.onload = function() {
  init();
};

到文档头中的脚本。我定义了init（）来声明和初始化全局变量，用它的数据填充表，并添加click事件监听器。

感谢评论者的兴趣和时间，特别感谢@nnnnnn关于我可能有的评论

将以前的全局函数或变量声明移动到文档就绪处理程序中，但继续尝试从不在就绪处理程序中的其他代码中引用它们。

虽然我看不出我在哪里做到了这一点，但它认为这种替代方法可以避免这种情况发生。

jQuery代码延迟JavaScript执行，直到页面加载导致JS抛出运行时错误

设置：

问题：

问题：

1 个答案: