chrome のブックマークレットでボタンを押したあとにinputに値を入力しイベントを強制発火する方法

• 概要
• 環境
• ブックマークレット(js)
• chrome への登録
• 最後に

概要

テキスト入力用のフォームなどにイベントが設定されてある場合はブックマークレットでは強制的にイベントを発火させる必要があります

環境

• macOS 15.1.1
• Google Chrome 131.0.6778.86

ブックマークレット(js)

javascript:(function(){
    var button = document.querySelector('input.pc-tab__hidden-input[type="checkbox"][name="pnav-group"]');
    if (button) {
        button.click();
    } else {
        alert('ボタンが見つかりません');
        return;
    }
    setTimeout(function() {
        var input = document.getElementById('search-text');
        if (input) {
            input.value = 'スイカゲーム';
            var event = new Event('input', { bubbles: true });
            input.dispatchEvent(event);
        } else {
            alert('入力フィールドが見つかりません');
        }
    }, 500);
})();

chrome への登録

あとは chrome のブックマークへ上記 Javascript を登録すれば OK です

最後に

ブックマークレットは対象のURLを開いてから実行する必要があるので注意してください

ブックマークレットだけで特定の URL を開いた上で JavaScript を実行することは難しいようです

ボタンを押してからテキストフィールドに入力するまでに0.5秒待っていますが画面がうまく動作しない場合は値を調整してください