创建 JavaScript 自定义事件

我想用 JavaScript 创建一个自定义事件。

我有一个 WPF 应用程序，里面有一个 WebBrowser，还有一个带有 JavaScript 的 HTML 页面。

我使用打印机工作。当打印机的状态发生变化时，它会触发.NET 中的事件。

然后，我调用 JavaScript 方法OnPrinterStateChanged(state)与InvokeScriptWebBrowser 控件的功能。

问题是我必须实现该方法OnPrinterStateChanged(state)在我的网页中。我无法更改方法的名称或订阅/取消订阅事件...

我想移动 JavaScript 方法OnPrinterStateChanged(state)在单独的 JavaScript 文件中。

我想要的是 ：

• 订阅/取消订阅 HTML 页面中的事件，并决定触发事件时我想要执行的操作（例如：“function ChangeState”）
• 当.NET事件被触发时，它会调用OnPrinterStateChanged(state)我单独的 .js 文件，然后触发 JavaScript 事件并且该函数ChangeState叫做。

我找到了一些解决方案，但没能使其发挥作用...最简单的方法是什么？

也许是这样的？

function OnPrinterStateChanged(state) {
    var evt = new CustomEvent('printerstatechanged', { detail: state });

    window.dispatchEvent(evt);
}


//Listen to your custom event
window.addEventListener('printerstatechanged', function (e) {
    console.log('printer state changed', e.detail);
});

另一种解决方案是使用函数组合，但这样就很难删除特定的侦听器。

function OnPrinterStateChanged(state) {}

function compose(fn1, fn2) {
    return function () {
        fn1.apply(this, arguments);
        fn2.apply(this, arguments);
    };
}

//Add a new listener
OnPrinterStateChanged = compose(OnPrinterStateChanged, function (state) {
    console.log('listener 1');
});

//Add another one
OnPrinterStateChanged = compose(OnPrinterStateChanged, function (state) {
     console.log('listener 2');
});

EDIT:

以下是使用 jQuery 的方法。

function OnPrinterStateChanged(state) {
    var evt = $.Event('printerstatechanged');
    evt.state = state;

    $(window).trigger(evt);
}


//Listen to your custom event
$(window).on('printerstatechanged', function (e) {
    console.log('printer state changed', e.state);
});