2

Optimizely A/B テスト サービスは.replaceWith("new HTML")、簡単な A/B テストを作成するために広範囲に使用します。これには、新しい要素の ID/クラスが同じであっても、置き換えられた要素からのイベントをリッスンしていたイベント リスナーが削除されるという副作用があります。

例：

  1. DOM には以下が含まれます。

    <div class="something">
  <button id="myButton"></button>
</div>

  2. 傾聴者: $("#myButton").click(function() { console.log('clicked!'); });

  3. と取り換える： $(".something").replaceWith("some new HTML, containing #myButton");

ステップ 3 の後#myButton、元の DOM 要素が破棄され、新しい要素が追加されたため、 を押しても機能しなくなりました。

この問題を解決するための適切で「クリーンな」方法は何でしょうか?

可能な解決策

  1. コードベースを把握し、Optimizely の実験で適切なイベント リスナーを「再追加」します。
    • 問題: A/B テスターは本当のソフトウェア開発者ではないかもしれません。これは面倒だと思います。
    • とてもきれいな方法のようには見えません

  2. Optimizely の後にコードを実行する方法を見つけ、その方法ですべてのイベント リスナーを追加します。これを行う良い方法はありますか？

  3. ここで説明されているように、「$.on() を使用したイベント委任」を使用します: HTML を jQuery に置き換え、イベント バインディングを保持する方法

    • 問題: 何を A/B テストして置き換えるかを正確に予測するのは難しい

編集： jQuery 1.11.xを使用しています

4

2 に答える 2

0

jQuery の onRemove() を使用して、Optimizely の「魔法」の背後で発生するイベント (例: 2200494 ) のリスナーを最初にセットアップできませんか?

于 2016-01-18T20:58:15.697 に答える