Question

我正在使用Respond.js来确保IE8中我的一个项目的bootstrap 3兼容性。

我正在使用respond.proxy.js加载一个大型CSS文件。在CSS被加载并被Respond撕掉之后，我必须初始化一些依赖于CSS的jQuery插件。

我希望能够像jQuery一样使用$(document).ready()。

是否可以创建自定义事件侦听器，例如。在Respond完成它的工作后被调用的$(respond).finished(...)？我需要在不同的脚本和文件中初始化这些插件。

Answer 1

由于respond.js不会触发任何事件或提供任何应用回调函数的方法，因此您唯一的选择是修改respond.js以使其触发事件。

我建议修改这一行：

https://github.com/scottjehl/Respond/blob/master/src/respond.js#L298

if (requestQueue.length) {
    var thisRequest = requestQueue.shift();

    ajax(thisRequest.href, function (styles) {
        translate(styles, thisRequest.href, thisRequest.media);
        parsedSheets[thisRequest.href] = true;

        // by wrapping recursive function call in setTimeout
        // we prevent "Stack overflow" error in IE7
        w.setTimeout(function () {
            makeRequests();
        }, 0);
    });
}/* from here on was added*/ else {
    var event = new Event("respondFinished");
    document.dispatchEvent(event);
}

现在，您可以在需要它的脚本中为文档添加事件侦听器。

if (window.respond.mediaQueriesSupported) {
    doSomething();
} else {
    $(document).on("respondFinished", doSomething);
}

您希望尽快添加此事件处理程序，最好在文档准备好之前确保事件在respond.js完成之前绑定。

如何为Respond.js创建自定义事件侦听器

1 个答案: