Перенаправьте событие keydown из родительского окна в iframe, содержащий reveal.JS
Я реализовал HTML-страницу, которая обертывает некоторые дополнительные функции вокруг iframe. Iframe содержит откровение.презентация js. Всякий раз, когда клавиша на клавиатуре нажата и в Родительском фрейме (не кадра) в центре внимания, я хочу передать событие в окне iframe (например, стрелка вправо нажата (родитель сосредоточен) --> стрелка вправо выполняется в iframe, как если бы он был сосредоточен - в итоге перехода к следующему слайду).
Я отвечаю за оба фрейма, и в конечном итоге они будут размещены в тот же домен. В целях развития я запустил браузер с отключенными функциями безопасности.
Я попробовал несколько методов на основе JQuery, таких как
$(document).keydown((event) => {
var e = jQuery.Event( "keydown", { keyCode: event.keyCode } );
$('#revealPresentation')[0].contentWindow.$('body').trigger(e);
});
И не смог заставить их работать. Я вернулся к простым методам JS:
$(document).keydown((event) => {
var newEvent = new KeyboardEvent("keydown", {
key: event.originalEvent.key, code: event.originalEvent.code,
charCode: event.originalEvent.charCode, keyCode: event.originalEvent.keyCode,
which: event.originalEvent.which
});
document.getElementById("revealPresentation")
.contentWindow.document.dispatchEvent(newEvent);
});
Это тоже не работает. Я думаю, что посылаю событие против неправильного элемента, но я не знаю, что является правильным элементом или что-то еще может быть неправильным. Может ли кто-нибудь привести рабочий пример или указать мне на правильный путь? направление? Я уже нашел несколько подобных вопросов, но они в основном касаются пользовательских событий и добавили соответствующий прослушиватель событий в код iframe. Я ни в коем случае не хочу менять iframe.
Решение:
Согласно этому сообщению WebKit имеет ошибку, которая в конечном итоге не заполнит свойство keyCode вновь созданного KeyboardEvent. Именно это свойство и оценивается в reveal.js для того, чтобы вызвать некоторые действия (например, следующий слайд). Мне удалось осуществить одну обходной путь (код был предложен в упомянутом посте):
document.addEventListener('keydown', (e) => {
let frame = document.getElementById('revealPresentation').contentDocument;
let newEvent = new Event('keydown', {key: e.key, code: e.code, composed: true, charCode: e.charCode, keyCode: e.keyCode, which: e.which, bubbles: true, cancelable: true, which: e.keyCode});
newEvent.keyCode = e.keyCode;
newEvent.which = e.keyCode;
frame.dispatchEvent(newEvent);
});
1 ответ:
Это странно, ваш код не кажется мне чем-то неправильным. Я также протестировал его на простом javascript, и все просто отлично работало.
Пример: https://jsfiddle.net/d7ap1ntz/
Слушатель в Родительском фрейме
document.addEventListener('keydown', e => { const frame = /*your iframe element*/; // dispatch a new event frame.contentDocument.dispatchEvent( new KeyboardEvent('keydown', {key: e.key}) ); })Слушатель в iframe
document.addEventListener('keydown', e => { console.log('keydown in iframe: ' + e.key) })Может ли это быть вызвано слушателем в вашем iframe?
Примечание: Iframe и его прослушиватель вставляются вручную в вышеприведенном примере, но он также работает через обычный HTML метить.
Comments