JavaScript로 키 프레스 이벤트를 프로그래밍 방식으로 시뮬레이션 할 수 있습니까?
답변
웹킷과 도마뱀 모두에서 작동하는 비 jquery 버전 :
var keyboardEvent = document.createEvent("KeyboardEvent");
var initMethod = typeof keyboardEvent.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";
keyboardEvent[initMethod](
"keydown", // event type: keydown, keyup, keypress
true, // bubbles
true, // cancelable
window, // view: should be window
false, // ctrlKey
false, // altKey
false, // shiftKey
false, // metaKey
40, // keyCode: unsigned long - the virtual key code, else 0
0 // charCode: unsigned long - the Unicode character associated with the depressed key, else 0
);
document.dispatchEvent(keyboardEvent);
답변
jQuery 1.3.1을 사용해도 괜찮다면 :
function simulateKeyPress(character) {
jQuery.event.trigger({ type : 'keypress', which : character.charCodeAt(0) });
}
$(function() {
$('body').keypress(function(e) {
alert(e.which);
});
simulateKeyPress("e");
});
답변
당신이 할 수있는 것은 트리거 프로그램이다 의 KeyEvent 청취자를 발사하여 한 KeyEvents를 . 샌드 박스 보안 관점에서이를 허용하는 것이 합리적입니다. 이 기능을 사용하여 일반적인 옵저버 패턴 을 적용 할 수 있습니다 . 이 방법을 “시뮬레이션”이라고 부를 수 있습니다.
아래는 jQuery와 함께 W3C DOM 표준에서이를 수행하는 방법의 예입니다.
function triggerClick() {
var event = new MouseEvent('click', {
'view': window,
'bubbles': true,
'cancelable': true
});
var cb = document.querySelector('input[type=submit][name=btnK]');
var canceled = !cb.dispatchEvent(event);
if (canceled) {
// preventDefault was called and the event cancelled
} else {
// insert your event-logic here...
}
}
이 예제는 https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events 에서 수정되었습니다.
jQuery에서 :
jQuery('input[type=submit][name=btnK]')
.trigger({
type: 'keypress',
which: character.charCodeAt(0 /*the key to trigger*/)
});
그러나 최근에는 브라우저-샌드 박스를 떠나는 키 이벤트를 실제로 트리거 할 수있는 [DOM] 방법이 없습니다. 그리고 모든 주요 브라우저 공급 업체는이 보안 개념을 준수합니다.
NPAPI 기반의 Adobe Flash와 같은 플러그인은 샌드 박스를 우회 할 수 있습니다 . Firefox .
상해:
Pekka가 이미 지적했듯이 보안상의 이유로 할 수 없으며 그렇게해서는 안됩니다. 당신은 항상 사이에 사용자 상호 작용이 필요합니다. 또한 다양한 프로그램 키보드 이벤트로 인해 스푸핑 공격이 발생하여 브라우저 공급 업체가 사용자에게 고소 당할 가능성을 상상하십시오.
대안 및 자세한 내용 은이 게시물 을 참조하십시오. 항상 플래시 기반 복사하여 붙여 넣기가 있습니다. 여기 우아한 예가 있습니다. 동시에 웹이 플러그인 공급 업체로부터 멀어지고있는 이유는 증거입니다.
옵트 인 CORS 정책 의 경우 원격 컨텐츠에 프로그래밍 방식으로 액세스 하는 경우에도 유사한 보안 사고 방식이 적용됩니다 .
정답은 다음과 같습니다 .
정상적인 상황에서는 샌드 박스 브라우저 환경에서 프로그래밍 방식으로 입력 키를 트리거 할 수있는 방법이 없습니다 .
결론 : 미래의 게임 또는 최종 사용자 경험에 대한 특별한 브라우저 모드 및 / 또는 특권으로 인해 그것이 불가능할 것이라고는 말하지 않습니다. 그러나 이러한 모드로 들어가기 전에 사용자는 Fullscreen API 모델 과 유사한 권한 및 위험을 묻습니다 .
유용한 : 키 코드의 맥락에서, 이 도구와 키 코드 매핑이 유용합니다.
공개 : 답변은 여기 에있는 답변을 기반으로합니다 .
답변
이와 같은 요소에서 키보드 이벤트를 전달할 수 있습니다
element.dispatchEvent(new KeyboardEvent('keypress',{'key':'a'}));
답변
당신은 사용할 수 있습니다 dispatchEvent()
:
function simulateKeyPress() {
var evt = document.createEvent("KeyboardEvent");
evt.initKeyboardEvent("keypress", true, true, window,
0, 0, 0, 0,
0, "e".charCodeAt(0))
var body = document.body;
var canceled = !body.dispatchEvent(evt);
if(canceled) {
// A handler called preventDefault
alert("canceled");
} else {
// None of the handlers called preventDefault
alert("not canceled");
}
}
나는 이것을 테스트하지 않았지만 dispatchEvent () documentation 의 코드에서 조정되었습니다 . 아마 그 내용과 createEvent () 및 initKeyEvent ()에 대한 문서를 읽고 싶을 것입니다.
답변
키보드 이벤트를 생성하고 전달할 수 있으며 등록 된 적절한 이벤트 핸들러를 트리거하지만 입력 요소로 전달되는 경우 text를 생성하지 않습니다 .
텍스트 입력을 완전히 시뮬레이션하려면 일련의 키보드 이벤트를 생성하고 입력 요소의 텍스트를 명시 적으로 설정해야합니다. 이벤트 순서는 텍스트 입력을 얼마나 철저하게 시뮬레이트할지에 따라 다릅니다.
가장 간단한 형태는 다음과 같습니다.
$('input').val('123');
$('input').change();
답변
경우에 따라 keypress
이벤트가 필요한 기능을 제공하지 못할 수도 있습니다. mozilla 문서 에서 해당 기능이 더 이상 사용되지 않음을 알 수 있습니다.
이 기능은 더 이상 권장되지 않습니다. 일부 브라우저는 여전히이 브라우저를 지원할 수 있지만 관련 웹 표준에서 이미 제거되었거나 삭제 중이거나 호환성을 위해서만 유지 될 수 있습니다. 사용하지 말고 가능한 경우 기존 코드를 업데이트하십시오. 결정을 안내하려면이 페이지 하단의 호환성 표를 참조하십시오. 이 기능은 언제든지 작동하지 않을 수 있습니다.
따라서 keypress
이벤트는 결과적으로 발생하는 두 개의 이벤트에서 결합되고 동일한 키에 대해 keydown
다음 keyup
이벤트가 발생하므로 이벤트를 하나씩 생성하십시오.
element.dispatchEvent(new KeyboardEvent('keydown',{'key':'Shift'}));
element.dispatchEvent(new KeyboardEvent('keyup',{'key':'Shift'}));