javascript - JavaScript カスタムイベントリスナーについて

Question

カスタムイベントについてかなりの調査 (Google) を行ってきましたが、質問に対する答えが見つからないようです。

私の質問は次のとおりです。この例では、スライドしているdiv内に s があり、divすべての子 s にアタッチされているカスタムイベントを作成したかったので、子の左オフセットが特定の範囲に達するdivたびに、カスタムdivその上のリスナーdivが実行されます。

本当に問題はonchange、click、onmouseupなどと同じレベルで本当にカスタムのイベントリスナーを作成できるかということです。

score 1 · Accepted Answer

jQueryを使用していることがわかりました。jQuery を使用してカスタムイベントを定義するのは非常に簡単です。私は次のようなパターンを使用します。

// Constructor
function Colorbar() {
    this.events = $({});
    // (Whatever else is in the class)
}
colorbar = new Colorbar();

その後、任意の名前のイベントをリッスンできます。

colorbar.events.on("currentcolorchanged", function(e, cb, ncolor) {
    helper.doColorChanged(ncolor);
});

そしてそれをトリガーします：

this.events.triggerHandler("currentcolorchanged", [this, ncolor]);

DOM オブジェクトを操作している場合は、DOM オブジェクトの jQuery をキャッシュするだけです。

var $ele = $("#myElement");
$ele.on("myCustomEvent", function(e) {
    // Event handler
});
$ele.triggerHandler("myCustomEvent");

score 0 · Accepted Answer

はい、onchange click onmouseup などのように機能する真のカスタムイベントを作成できますが、既存のイベントまたはメソッドに基づいてリスナーコードを自分で作成する必要があります。

この場合、移動イベントでオフセット値を確認し、その目標値に達したときにカスタムイベントをトリガーします。

javascript - JavaScript カスタム イベント リスナーについて