맞춤형 사용자 상호작용을 위해서는 Chrome의 텍스트 영역 요소에서 keydown 이벤트를 시뮬레이션하는 것이 필수적입니다. 그러나 특정 시도에서는 예상치 못한 결과가 발생할 수 있습니다.
원하는 keyCode와 함께 initKeyboardEvent를 사용하여 keydown 이벤트를 시작하려고 했지만 텍스트 영역이 잘못된 키 값을 등록했습니다(의도한 문자 대신 Enter). 속성 재정의와 관련된 대체 접근 방식도 실패했습니다.
이 문제를 해결하려면 'keyCode' 외에 'which' 속성을 재정의해야 합니다. 수정된 코드 샘플은 다음과 같습니다.
<code class="js">document.addEventListener('keydown', e => console.log( 'altKey : ' + e.altKey + '\n' + 'charCode (Deprecated) : ' + e.charCode + '\n' + 'code : ' + e.code + '\n' + 'ctrlKey : ' + e.ctrlKey + '\n' + 'isComposing : ' + e.isComposing + '\n' + 'key : ' + e.key + '\n' + 'keyCode (Deprecated) : ' + e.keyCode + '\n' + 'location : ' + e.location + '\n' + 'metaKey : ' + e.metaKey + '\n' + 'repeat : ' + e.repeat + '\n' + 'shiftKey : ' + e.shiftKey + '\n' + 'which (Deprecated) : ' + e.which + '\n' + 'isTrusted : ' + e.isTrusted + '\n' + 'type : ' + e.type )); const Podium = {}; Podium.keydown = function(k) { const oEvent = document.createEvent('KeyboardEvent'); // Chromium Hack Object.defineProperty( oEvent, 'keyCode', { get : function() { return this.keyCodeVal; } } ); Object.defineProperty( oEvent, 'which', { get : function() { return this.keyCodeVal; } } ); if (oEvent.initKeyboardEvent) { oEvent.initKeyboardEvent("keydown", true, true, document.defaultView, false, false, false, false, k, k); } else { oEvent.initKeyEvent("keydown", true, true, document.defaultView, false, false, false, false, k, 0); } oEvent.keyCodeVal = k; if (oEvent.keyCode !== k) { alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")"); } document.dispatchEvent(oEvent); } //Sample usage Podium.keydown(65);</code>
'keyCode'와 'which'를 모두 재정의하면 keydown 이벤트 중에 올바른 키 코드와 해당 키가 등록되도록 할 수 있습니다. 이 접근 방식은 잘못된 키 등록 문제를 수정하고 정확한 키다운 시뮬레이션을 허용합니다.
위 내용은 Chrome에서 Keydown을 시뮬레이션할 때 잘못된 키가 등록되는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!