JavaScript를 사용한 마우스 클릭 시뮬레이션: 종합 가이드
JavaScript를 사용하여 마우스 클릭 이벤트를 시뮬레이션하는 일반적인 방법 중 하나는 document.form입니다. 버튼.클릭(). 이 방법을 사용하면 양식 버튼의 클릭 동작을 직접 트리거할 수 있습니다.
그러나 onclick 이벤트를 더 정확하게 시뮬레이션하려면 쿼리에 제공된 코드를 활용할 수 있습니다.
function contextMenuClick() { var element= 'button'; var evt = element.ownerDocument.createEvent('MouseEvents'); evt.initMouseEvent('contextmenu', true, true, element.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 1, null); element.dispatchEvent(evt); }
이 코드는 새 마우스 이벤트를 생성하고 해당 속성을 초기화한 다음 지정된 요소에 전달합니다.
사용자 정의 가능한 이벤트 시뮬레이션
더 많은 유연성을 위해 다음 기능 사용을 고려하십시오.
function simulate(element, eventName, options) { // Set default options var defaultOptions = { pointerX: 0, pointerY: 0, button: 0, ctrlKey: false, altKey: false, shiftKey: false, metaKey: false, bubbles: true, cancelable: true }; // Extend default options with provided options for (var property in options) defaultOptions[property] = options[property]; // Determine event type var eventType = null; for (var name in eventMatchers) { if (eventMatchers[name].test(eventName)) { eventType = name; break; } } // Create and initialize event var oEvent; if (document.createEvent) { if (eventType == 'HTMLEvents') { oEvent = document.createEvent(eventType); oEvent.initEvent(eventName, defaultOptions.bubbles, defaultOptions.cancelable); } else { oEvent = document.createEvent(eventType); oEvent.initMouseEvent(eventName, defaultOptions.bubbles, defaultOptions.cancelable, document.defaultView, defaultOptions.button, defaultOptions.pointerX, defaultOptions.pointerY, defaultOptions.pointerX, defaultOptions.pointerY, defaultOptions.ctrlKey, defaultOptions.altKey, defaultOptions.shiftKey, defaultOptions.metaKey, defaultOptions.button, element); } element.dispatchEvent(oEvent); } else { // Legacy IE fallback defaultOptions.clientX = defaultOptions.pointerX; defaultOptions.clientY = defaultOptions.pointerY; oEvent = document.createEventObject(); oEvent = extend(oEvent, defaultOptions); element.fireEvent('on' + eventName, oEvent); } return element; }
이 기능을 사용하면 마우스 좌표, 버튼 누름 및 시뮬레이션된 이벤트에 대한 사용자 정의 옵션을 지정할 수 있습니다. 수정자 키.
사용법
기능을 사용하려면, 대상 요소, 이벤트 이름 및 원하는 옵션을 제공하기만 하면 됩니다.
simulate(document.getElementById("btn"), "click", { pointerX: 123, pointerY: 321 });
이렇게 하면 사용자 정의 마우스 좌표를 사용하여 "btn" 요소에 대한 클릭 이벤트가 시뮬레이션됩니다.
위 내용은 사용자 정의 가능한 옵션을 사용하여 JavaScript에서 마우스 클릭을 어떻게 시뮬레이션할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!