Question

假设我的脚本中有以下内容。

document.addEventListener('DOMContentLoaded', function() {
  alert("DOM loaded!");
});

我将上面的内部定义功能包含在requirejs中。

define([
  'jquery',
  'underscore',
  'backbone',
], function($, _, Backbone) {
  document.addEventListener('DOMContentLoaded', function() {
    alert("DOM loaded!"); // I AM NEVER CALLED :(
  });
});

似乎DOM内容已经在requireJS加载脚本中定义的模块时加载。当我必须听取youtubeIframeAPIReady等其他全球事件时，同样的问题仍然存在。使用requireJS时解决此类问题的惯例是什么？

Answer 1

处理DOMContentLoaded的标准方法是使用jQuery的$.ready如果你使用jQuery或使用RequireJS'domReady插件，如果你不是。（好吧，你可以使用domReady，即使你使用的是jQuery，但我没有看到它。）jQuery和domReady都能够处理DOMContentLoaded发生的情况在使用这些方法之前。

使用jQuery，您的代码将成为：

define([
  'jquery',
  'underscore',
  'backbone',
], function($, _, Backbone) {
  $(function() {
    alert("DOM loaded!");
  });
});

上面的代码使用函数调用$，这是使用$.ready的缩写方式。使用domReady即可：

define([
  'jquery',
  'underscore',
  'backbone',
  'domReady!',
], function($, _, Backbone) {
    alert("DOM loaded!");
});

以这种方式使用，回调到define的代码在DOM加载之前不会执行。

我不知道youtubeIframeAPIReady的等价物。

使用requireJS时如何监听全局事件

1 个答案: