除了「document.form.button.click()」之外，如何在 JavaScript 中模擬滑鼠點擊事件？

使用JavaScript 模擬滑鼠點選事件：超越document.form.button.click()

document.form.button.click( ) 方法允許我們以程式方式觸發按鈕點擊。但是，它並沒有模擬實際的 onclick 事件。為了更全面的事件模擬，我們需要深入研究自訂事件創建領域。

一種方法涉及使用 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應用程式中的高級可能性。

以上是除了「document.form.button.click()」之外，如何在 JavaScript 中模擬滑鼠點擊事件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！