Question

我正在尝试在scroll下加载的窗口上触发keypress事件或jsdom事件。我使用jsdom.jsdom()函数加载了窗口，并且它加载了外部资源（即页面本身的脚本）。基本上我试图触发这些事件，以便页面上的javascript可以监听这些事件并加载下一页数据，因为页面在滚动到底部时具有自动加载功能。但是我在触发scroll事件时遇到了麻烦，更不用说触发scroll到页面底部了。它只是卡住了，没有任何事情发生。

我还尝试使用keypress的键触发end事件，但为此我甚至无法为keypress设置处理程序。再次陷入困境。

我在窗口上使用jsdom.jqueryify()在其中嵌入jquery代码。我想我可以使用像.scroll（）这样的jquery函数来设置一个测试处理程序，但它再次陷入困境，没有给出任何错误消息。这是代码：

var document = jsdom.jsdom(str, null, {});
var window = document.parentWindow;

jsdom.jQueryify(window, "jquery.js", function () {
    $(window).scroll(function(){
        console.log("Scroll Happened.");
    });
    console.log("Triggering Scroll event...");  // 1
    $(window).trigger('scroll');
    console.log("Scroll event triggered.");     // 2
}

此代码甚至没有达到第一个位置，但是如果我将$(window)更改为window，它会越过第一个位置但仍未达到第二个位置。

我也尝试过：

window.dispatchEvent('scroll');
window.scrollByLines(1);

而不是：

window.trigger('scroll');

但没有变化。任何帮助将不胜感激。感谢

Answer 1

问题非常简单：$未在代码执行的上下文中定义。修复方法是向参数window和$添加参数。它们按照您的预期由jQueryify初始化。以下输出到控制台所需的一切：

var jsdom = require("jsdom");

var document = jsdom.jsdom();
var window = document.parentWindow;

jsdom.jQueryify(window, "jquery-1.10.2.js", function (window, $) {
    try {
        $(window).scroll(function(){
            console.log("Scroll Happened.");
        });
        console.log("Triggering Scroll event...");  // 1
        $(window).trigger('scroll');
        console.log("Scroll event triggered.");     // 2
    }
    catch (ex) {
        console.log(ex);
    }
});

为了便于说明，我添加了try ... catch。如果您从参数中删除window, $，则可以看到try ... catch捕获ReferenceError，因为未定义$。

这里的教训是jsdom有效地创建了一个新的JavaScript虚拟机，它在其中执行窗口加载的脚本。因此，在此虚拟机中定义的符号不必在其外部定义。并且在jsdom虚拟机和之外定义的同名符号通常不指向相同的对象。（例如，jsdom创建的虚拟机外部的console和console内部的{{1}}不是同一个对象。）

以编程方式触发jsdom窗口中的滚动或按键事件

1 个答案: