javascriptからIMEをcancelする
Scrapboxで確認済み
他のサイトでも使えるかもしれない
方法
正攻法はない
/icons/fail.iconEscapeキーを何らかの要素に渡してkey eventを発火させたらどうだろうか？
<text-input>に直接渡すのは無理だった
別の要素に渡すのはどうだろうか？
Scrapboxなら、#editorに渡したらどうだ？
試してみるか。
21:46:05 だめだった
最初入力した「は表示されたまま
その後何か入力すると、変換中の文字が何も表示されなくなる
変換候補だけが見える
変換中の文字を一旦全部消してからまた入力すると復活する
code:test1.js
export function execute() {
const editor = document.getElementById('editor');
document.addEventListener('compositionupdate', e => {
const buttons = document.getElementsByClassName('popup-menu')
?.0?.getElementsByClassName('button') if (!buttons) return; // そもそもpopup menuがなかったら何もしない
if (e.data.length === 0) return;
switch(e.data.split('').pop()) {
case '「':
//e.preventDefault();
//e.stopPropagation();
document.getElementsByClassName('button link-button')?.0?.click(); // IMEを強制終了させる
const eventParams = {
keyCode: 27,
key: 'Escape',
bubbles: true,
cancelable: true,
};
editor.dispatchEvent(new KeyboardEvent('keydown', eventParams));
//editor.dispatchEvent(new KeyboardEvent('keyup', eventParams));
break;
default:
break;
}
});
}
/icons/pass.icon一旦別の入力欄にfocusを移す
どうやら#text-inputからfocusが外れるとIMEが自動的に確定されるみたい？
21:54:16 ビンゴ！
あとは確定して流し込まれた文字列を削除すればいい
どのcomposition系eventで捕捉できるかな？
e.dataの文字列が流し込まれるんだった。
じゃあこれ使えばいいか。
code:test2.js
export function execute() {
const textInput = document.getElementById('text-input');
document.addEventListener('compositionupdate', e => {
const buttons = document.getElementsByClassName('popup-menu')
?.0?.getElementsByClassName('button') if (!buttons) return; // そもそもpopup menuがなかったら何もしない
if (e.data.length === 0) return;
switch(e.data.split('').pop()) {
case '「':
//e.preventDefault();
//e.stopPropagation();
document.getElementsByClassName('button link-button')?.0?.click(); // IMEの文字列を強制的に確定させる
textInput.blur();
// 確定して流し込まれた文字列を削除する
const deleteParam = {keyCode: 8, key: 'Backspace', bubbles: true, cancelable: true};
e.data.split('').forEach(() =>{
textInput.dispatchEvent(new KeyboardEvent('keydown', deleteParam));
textInput.dispatchEvent(new KeyboardEvent('keyup', deleteParam));
});
// カーソルのfocusを戻す
textInput.focus();
break;
default:
break;
}
});
}