JavaScript で「document.form.button.click()」以外のマウス クリック イベントをシミュレートするにはどうすればよいですか?

JavaScript を使用したマウス クリック イベントのシミュレート: document.form.button.click() を超えて

document.form.button.click( ) メソッドを使用すると、ボタンのクリックをプログラムでトリガーできます。ただし、実際の onclick イベントはシミュレートされません。より包括的なイベント シミュレーションを行うには、カスタム イベント作成の領域を詳しく調べる必要があります。

1 つの方法では、JavaScript の createEvent() 関数を使用します。ただし、HTML やマウス イベント以外のイベント タイプを処理する場合、このアプローチには制限があります。

これを克服するには、より高度なアプローチを活用できます。

function simulate(element, eventName) {
  // Extract event type and create an event object
  var eventType = eventMatchers[eventName];
  if (!eventType) throw new Error('Event type not supported');
  var event;
  if (document.createEvent) {
    event = document.createEvent(eventType);
    eventType == 'HTMLEvents'
      ? event.initEvent(eventName, true, true)
      : event.initMouseEvent(
          eventName,
          true,
          true,
          document.defaultView,
          0,
          0,
          0,
          0,
          0,
          false,
          false,
          false,
          false,
          0,
          element
        );
  } else {
    var evt = document.createEventObject();
    event = extend(evt, defaultOptions);
  }

  // Dispatch the event
  element.dispatchEvent(event);
}

この関数は要素を受け取ります。およびイベント タイプをパラメータとして使用し、イベント タイプに基づいてカスタム イベント オブジェクトを作成します。次に、指定された要素でイベントをディスパッチします。

このアプローチをさらに強化するには、デフォルトのイベント オプションを含め、ユーザーが追加のパラメーターを渡すことでそれらをオーバーライドできるようにします。

function simulate(element, eventName, options) {
  options = extend(defaultOptions, options || {});
  // ... rest of the simulate function
}

これにより、機能強化により、次のようにカスタム マウス座標やその他のイベント パラメータを指定できるようになりました:

simulate(document.getElementById("btn"), "click", {
  pointerX: 123,
  pointerY: 321,
});

このカスタム イベント シミュレーション技術を利用することで、事実上あらゆるマウス クリックをトリガーできます。イベントパラメータを完全に制御して、JavaScript アプリケーションの高度な可能性を解き放ちます。

以上がJavaScript で「document.form.button.click()」以外のマウス クリック イベントをシミュレートするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。